js和jQuery加载DOM的几种方法对比

Posted 2022-12-13 Freeguy88

JS： window.οnlοad=function() //代码 等价于 JQ：$(window).load(function() //代码 )

另：jq中的 $ ( document ). ready ( function () //代码 简写1. $(function() //代码 ) 简写2. $().ready(function() //代码 )
三者等价，但和上面的有差别： 这两种写法表示在DOM加载完成就执行里面的代码，但对一些图片等其他还未加载的文件不能进行操作；而上面的表示要在网页中所有的元素（元素和所有关联文件）都加载到浏览器后才执行里面的代码，这时可以操作DOM中的任何元素。


对比：window.onload 和 $(document).ready() window.onload 方法不能多次使用，而后者可以。 原因：前者一次只能保存一个对象的引用，它会自动用后面的函数覆盖前面的函数；而$(document).ready()可以在每次调用时在现有的行为上追加新的行为，且这些行为函数会按照注册的顺序依次执行

例子： function one() alert("one"); function two() alert("two");
//用window.onload window.onload = one; window.onload = two; //结果：只弹出 “two” 对话框
//用$(document).ready() $(document).ready(function() one(); ) $(document).ready(function() two(); ) //结果：先弹出“one”对话框，后弹出“two” 对话框