當頁面加載完運行js

1.用原生jsjquery

window.onload=function(){瀏覽器

}函數

2.用jquery事件

$(document).ready(function(){文檔

});io

簡寫function

$(function(){下載

});程序

PS:二者的主要區別方法

window.onload:

當一個文檔徹底下載到瀏覽器中時,纔會觸發window.onload事件。這意味着頁面上的所有元素對js而言都是能夠操做的,也就是說頁面上的全部元素加載完畢纔會執行。這種狀況對編寫功能性代碼很是有利,由於無需考慮加載的次序。、

$(document).ready{ }:

會在DOM徹底就緒並可使用時調用。雖然這也意味着全部元素對腳本而言都是能夠訪問的,可是,並不意味着全部關聯的文件都已經下載完畢。換句話說,當HMTL下載完成並解析爲DOM樹以後,代碼就會執行。

舉一個例子:

假設有一個表現圖庫的頁面,這種頁面中可能會包含許多大型圖像,咱們能夠經過jQuery隱藏、顯示或以其餘方式操做這些圖像。若是咱們經過onload頁面設置界面,那麼用戶在可以使用這個頁面以前,必需要等到每一幅圖像都下載完成。更糟糕的是,若是行爲稍微添加給哪些具備默認行爲的元素(好比連接),那麼用戶的交互可能會致使意想不到的結果。然而當咱們試用$(document).ready(){ }進行設置時,這個界面就會更早地準備好可用的正確行爲。

使用$(document).ready(){ }通常來講都要優於試用onload事件處理程序,但必需要明確一點的是,由於支持文件可能尚未家在完成,因此相似圖像的高度和寬度這樣的屬性此時不必定有效。

注:用把js放在頁面底部的方法以及運用defer="defer" 的方法都是會出現問題的。最好使用上面的函數!

相關文章
相關標籤/搜索