目前不分離的java項(xiàng)目，有一個(gè)翻頁，之前是通過url地址傳參來請(qǐng)求，數(shù)據(jù)直接返回在當(dāng)前頁面
但是后來因?yàn)樾枨蟾淖?，參?shù)增加了很多，不再適合url請(qǐng)求，于是我們換成了ajax的post請(qǐng)求
請(qǐng)求成功，但是后端反的數(shù)據(jù)是一整個(gè)頁面的html，因?yàn)橹耙恢睕]有前后端分離，后端接口不會(huì)傳json，這就讓我很方了
為了不大改，只有看前端有什么方法重新渲染了
既然能拿到頁面，那我最開始的想法就是直接替換這個(gè)頁面的內(nèi)容
document.write()
沒錯(cuò)就是這樣，但后面遇到了兩個(gè)小坑

//第一次的代碼
 $.ajax({
            url:'<%=request.getContextPath()%>/project/proList',
            type:'post',
            dataType:'json',
            data:data,
            success : function(data){
              document.write(data.responseText);
            }
        })

這樣寫，發(fā)現(xiàn)什么都不對(duì)，最后根本進(jìn)入不了success ，
然后我就寫了error，想看看是哪里出錯(cuò)

//調(diào)試
$.ajax({
            url:'<%=request.getContextPath()%>/project/proList',
            type:'post',
            dataType:'json',
            data:data,
            success : function(data){
                document.write(data.responseText);
            },
            error:function(data){
        console.log(data)
            }
        })

這次意外發(fā)現(xiàn)請(qǐng)求最后是進(jìn)入了error，并且打印出來后端反的html頁面
查了寫資料，原來后端直接反頁面，數(shù)據(jù)就不是json，自然就會(huì)異常進(jìn)入error,既然后端沒辦法改，那我們也只有曲線救國，不走success 就不走，我們就用error渲染

//繼續(xù)調(diào)試
$.ajax({
            url:'<%=request.getContextPath()%>/project/proList',
            type:'post',
            dataType:'json',
            data:data,
            success : function(data){
                //因?yàn)榉祷亓怂械膆tml數(shù)據(jù)，不是json格式，所以不進(jìn)入success而是進(jìn)入error
            },
            error:function(data){
        document.write(data.responseText);
            }
        })

這樣寫，OK，數(shù)據(jù)出來，可以翻頁了，但是問題又來了，我們翻一頁正常，多次翻頁后會(huì)發(fā)現(xiàn)之前的頁面內(nèi)容還在，一直在疊加，這樣可不行哦
度娘了下

如果document.write()在DOMContentLoaded或load事件的回調(diào)函數(shù)中，當(dāng)文檔加載完成，
則會(huì)先清空文檔（自動(dòng)調(diào)用document.open()），再把參數(shù)寫入body內(nèi)容的開頭。
在異步引入的js和DOMContentLoaded或load事件的回調(diào)函數(shù)中運(yùn)行document.write()，
運(yùn)行完后，最好手動(dòng)關(guān)閉文檔寫入（document.close()）。

方法找到，繼續(xù)修改

 $.ajax({
            url:'<%=request.getContextPath()%>/project/proList',
            type:'post',
            dataType:'json',
            data:data,
            success : function(data){
                //因?yàn)榉祷亓怂械膆tml數(shù)據(jù)，不是json格式，所以不進(jìn)入success而是進(jìn)入error
            },
            error:function(data){
              document.write(data.responseText);
              document.close();
            }
        })

大功告成

自從前后端不分離處理頁面后，我深深感受到了坑，但沒辦法，為了我熱愛的工作.........

參考：https://segmentfault.com/a/1190000007958530