echoin項目整理總結

一、頁面加載完執行的函數

$(document).ready是DOM結構繪製完畢後就執行，沒必要等到加載完畢。 意思就是DOM樹加載完畢，就執行，沒必要等到頁面中圖片或其餘外部文件都加載完畢。而且能夠寫多個.ready。

$(document).ready(function () {
    $('.headerPage').load('header.html')
    $('.footerPage').load('footer.html')
  })

window.onload是頁面全部元素都加載完畢，包括圖片等全部元素。只能執行一次。

window.onload = function () {

}

若是須要獲取DOM綁定元素的屬性值時，最好使用window.onload,由於他是在全部元素加載完畢才執行，若是使用$(document).ready，DOM已經加載，可是DOM綁定的元素屬性沒有加載，因此屬性不生效。要解決這個問題，能夠使用 Jquery 中另外一個關於頁面加載的方法 ---load() 方法。 Load() 方法會在元素的 onload 事件中綁定一個處理函數。若是處理函數綁定給 window 對象，則會在全部內容 ( 包括窗口、框架、對象和圖像等 ) 加載完畢後觸發，若是處理函數綁定在元素上，則會在元素的內容加載完畢後觸發。

//Jquery 代碼以下： 
$(window).load(function ()
{ 

});
//等價於 JavaScript 中的如下代碼 
Window.onload = function ()
{
 
}

2.jq的scroll事件

$(document).ready(function() {
	$(document).scroll(function () {
	var left = document.getElementById('faq_cont').offsetLeft - 180
	// 滾動的高度
    var scroH = $(document).scrollTop();
	if (scroH >= 480) {
      $(".questionList").css({position: 'fixed',left: left,top: '0'});
      	// $(".questionList").css({position: 'fixed'});
		} else {
		  $(".questionList").css({position: 'absolute',left: '-180px',top: '40px'});
		}
	})
})