jquery中的$(document).ready()与window.onload的区别
更新时间:2009年11月18日 20:01:15 作者:
浏览器执行window.onload函数不仅仅是在构建完DOM树之后, 也是在所有图像和其他外部资源完整的加载并且在浏览器窗口显示完毕之后.
所以如果某个图片或者其他资源加载很长时间, 访问者就会看到一个不完整的页面, 甚至在图片加载之前就执行了需要依赖动态添加的元素的脚本而导致脚本错误.
window.onload = function() { testDiv.innerHTML = "<div style=\"border:solid 1px #FF0000\">动态创建的div</div>"; }
解决办法就是等DOM被解析后, 在图像和外部资源加载之前执行我们的函数.在jQuery中让这一实现变得可行:
//jQuery 使用动态创建的$(document).ready(function)方法
$(document).ready(
function() { testDiv.innerHTML = "<div style=\"border:solid 1px #FF0000\">使用动态创建的$(document).ready(function)方法</div>"; }
);
//或者使用简便语法:
/jQuery 使用$(function)方法
$(
function() { testDiv.innerHTML += "<div style=\"border:solid 1px #FF0000\">使用$(function)方法</div>"; }
);
window.onload = function() { testDiv.innerHTML = "<div style=\"border:solid 1px #FF0000\">动态创建的div</div>"; }
解决办法就是等DOM被解析后, 在图像和外部资源加载之前执行我们的函数.在jQuery中让这一实现变得可行:
复制代码 代码如下:
//jQuery 使用动态创建的$(document).ready(function)方法
$(document).ready(
function() { testDiv.innerHTML = "<div style=\"border:solid 1px #FF0000\">使用动态创建的$(document).ready(function)方法</div>"; }
);
//或者使用简便语法:
/jQuery 使用$(function)方法
$(
function() { testDiv.innerHTML += "<div style=\"border:solid 1px #FF0000\">使用$(function)方法</div>"; }
);
您可能感兴趣的文章:
- jquery $(document).ready() 与window.onload的区别
- JQuery onload、ready概念介绍及使用方法
- jquery的$(document).ready()和onload的加载顺序
- 解析页面加载与js函数的执行 onload or ready
- 一张表格告诉你windows.onload()与$(document).ready()的区别
- JQuery的ready函数与JS的onload的区别详解
- 浅析document.ready和window.onload的区别讲解
- jQuery中document与window以及load与ready 区别详解
- JQ中$(window).load和$(document).ready区别与执行顺序
相关文章
jQuery position() 函数详解以及jQuery中position函数的应用
position()函数用于返回当前匹配元素相对于其被定位的祖辈元素的偏移,也就是相对于被定位的祖辈元素的坐标。该函数只对可见元素有效,通过本文给大家介绍jQuery position() 函数详解以及jQuery中position函数的应用,感兴趣的朋友一起学习吧2015-12-12Jquery each方法跳出循环,并获取返回值(实例讲解)
这篇文章主要是对Jquery each方法跳出循环,并获取返回值进行了详细的介绍,需要的朋友可以过来参考下,希望对大家有所帮助2013-12-12
最新评论