Javascript Touch事件學(xué)習(xí)筆記5 實現(xiàn)一個APP框架三 向下滑動加載更多
上篇筆記（進入）討論了向上滑動加載新內(nèi)容，現(xiàn)在在上篇文章的基礎(chǔ)上來新增功能，向下滑動加載更多內(nèi)容。
一：為了更加接近網(wǎng)易新聞APP，填充一些數(shù)據(jù)。
二：加載更多觸發(fā)的條件,即當(dāng)整個新聞快滑動到底部的時候。
用到的知識點：
1；document.body.scrollHeight 頁面總高度
document.body.scrollTop 滾動的高度
document.documentElement.clientHeight 可見區(qū)域的高度
當(dāng)滾動到頁面最底部的時候document.body.scrollHeight - document.body.scrollTop = document.documentElement.clientHeight
另外，這樣的實現(xiàn)方法還要求當(dāng)其他的view沒有被選中時，要隱藏掉，選中時在顯示出來，以便不影響document.body.scrollHeight和document.body.scrollTop的值。
在這么實施的時候遇到一個問題，也許是css3和display的組合使用的問題。當(dāng)時該顯示的時候沒有正常顯示出來。所以最后沒有使用display:none,而是使用的height和overflow的組合，具體css3和display的bug留到以后有時間的時候再來看。
2：在Util中新增了CreateHTML，將拼好的字符串轉(zhuǎn)成html以便于使用appendChild的方法
CreateHTML: function (htmlStr) {
var frag = document.createDocumentFragment(),
temp = document.createElement('div');
temp.innerHTML = htmlStr;
while (temp.firstChild) {
frag.appendChild(temp.firstChild);
}
return frag;
}
注意方法體利用了：當(dāng)把一個節(jié)點的childNode append到另一個節(jié)點時，該childNode會從原來的節(jié)點處刪除！！！！！！！
3，在移動端，由于人為的禁止了touchmove事件，所以要手動設(shè)置滾動效果
var target = $.AppFrame.GetEventTargetObj(e);
var offsetY = target.clientY - $.AppFrame.startY;
document.body.scrollTop = $.AppFrame.startScrollTop - offsetY;
讓滾動條隨著手勢滾動
Demo入口：摸這里