關于JS與jQuery中的文檔加載問題

來源：懂視網責編：小采時間：2020-11-27 22:31:55

關于JS與jQuery中的文檔加載問題

關于JS與jQuery中的文檔加載問題:jquery中的$(document).ready()類似于javascript中的window.onload()，但是其中還是有很大區別的 1.jquery中的可以簡化為$().ready()，$(function), 而js卻不行必須全部寫完。 2.同時js的window.onload()只能有一個，而jquery的$

推薦度：

點擊下載本文 文檔為doc格式

導讀關于JS與jQuery中的文檔加載問題:jquery中的$(document).ready()類似于javascript中的window.onload()，但是其中還是有很大區別的 1.jquery中的可以簡化為$().ready()，$(function), 而js卻不行必須全部寫完。 2.同時js的window.onload()只能有一個，而jquery的$

jquery中的$(document).ready()類似于javascript中的window.onload()，但是其中還是有很大區別的

1.jquery中的可以簡化為$().ready()，$(function), 而js卻不行必須全部寫完。

2.同時js的window.onload()只能有一個，而jquery的$(document).ready()卻可以有多個。

3.最重要的一點是window.onload必須等到頁面內包括圖片的所有元素加載完畢后才能執行。

　　　　　　　$(document).ready()是DOM結構繪制完畢后就執行，不必等到加載完畢。

下面說說在項目中遇到的問題

先上代碼，這個demo中我不用引入jquery包就可以使用類似jquery的$(id)(我個人不建議使用)，在這個demo中頁面會彈出"1"，在此處完全沒有問題。

<!DOCTYPE html>
<head> 
<title>JS</title> 
<script>
function $(id){return document.getElementById(id)};
window.onload = function(){
 alert($("aaa").value);
};
</script>
</head> 
<body> 
<input id="aaa" value="1" />
</body> 
</html>

再上代碼，此處的問題會報錯"Cannot read property 'ready' of null"，可以自己先想想為什么。。

<!DOCTYPE html>
<head> 
<title>JS</title> 
<script src="js/jquery-2.1.1.min.js"></script>
<script>
function $(id){return document.getElementById(id)};
$(document).ready(function(){　　　　　　　　　　　　　　　　　　　　　　//這是錯誤的代碼案列
$("#aaa").click(function(){
 $("#aaa").hide();
});
});
</script>
</head> 
<body> 
<a id="aaa" value="1" >aaaaaa</a>
</body> 
</html>

問題在與我們對"$"定義了一個函數，同時又想使用jquery提供的"$",所以報錯"Cannot read property 'ready' of null",問題在于我們寫的"$"影響了$(document)這塊，所以還是老老實實導包，別嫌麻煩，不然出現bug,要是在不熟悉的其中語法(代碼就一行，項目大的話還不容易發現。o(╥﹏╥)o)，改bug就要更長的時間，也是醉了。

總結

以上所述是小編給大家介紹的JS與jQuery中的文檔加載問題，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對腳本之家網站的支持！

聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com