$(document).ready和window.onload的区别

最新推荐文章于 2024-11-11 15:05:35 发布

jkpi888

最新推荐文章于 2024-11-11 15:05:35 发布

阅读量809

点赞数

分类专栏： jquery javascript 文章标签： document.ready window.onload

javascript 同时被 2 个专栏收录

27 篇文章

订阅专栏

jquery

4 篇文章

订阅专栏

window.onload和$(document).ready的区别

1.执行时间

window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行。
$(document).ready()是DOM结构绘制完毕后就执行，不必等到加载完毕。

2.编写个数不同

window.onload不能同时编写多个，如果有多个window.onload方法，只会执行一个
$(document).ready()可以同时编写多个，并且都可以得到执行

3.简化写法

window.onload没有简化写法
$(document).ready(function(){})可以简写成$(function(){});

例子

  
<html>
<head runat="server">
    <title>测试JQuery</title>
        <script type="text/javascript">
        window.onload = function () {
            var str = document.getElementById("lbtestJs").innerHTML + "<br />这个是Window.onload方法；";
            document.getElementById("lbtestJs").innerHTML = str;
        };
        $(function () {
            $("#lbtestJs").html($("#lbtestJs").html() + "<br /> 这个是JQuery的$(document).ready()；");
        });
    
</script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    测试JQuery和JavaScript：<br />
    <label id="lbtestJs">sss</label>
    </div>    
    </form>
</body>
</html>

参考资料： $(document).ready和window.onload的区别 http://www.studyofnet.com/news/261.html