关于JS与jQuery中的文档加载问题

时间：2021-05-25

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中的文档加载问题，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对网站的支持！

声明：本页内容来源网络，仅供用户参考；我单位不保证亦不表示资料全面及准确无误，也不保证亦不表示这些资料为最新信息，如因任何原因，本网内容或者用户因倚赖本网内容造成任何损失或损害，我单位将不会负任何法律责任。如涉及版权问题，请提交至online#300.cn邮箱联系删除。

相关文章