巅峰霸主 > 设计开发 > 前端技术 >

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

时间:2021-03-24 04:28:05  来源:巅峰霸主网  作者:烈火大地 点击:
摘要:本文主要讲述jQuery中$(document).ready()和JavaScript中的window.onload方法的联系和区别,下面图片对比说明他们之间的相同与不同之处……

jQuery 入口函数:

$(document).ready(function(){
    // 执行代码});或者$(function(){
        // 执行代码
    });

JavaScript 入口函数:

window.onload = function () {
    // 执行代码
    }

jQuery 入口函数与 JavaScript 入口函数的区别:

  • jQuery 的入口函数是在 html 所有标签(DOM)都加载之后,就会去执行。

  • JavaScript 的 window.onload 事件是等到所有内容,包括外部图片之类的文件加载完后,才会执行。

实例代码:

<script src="js/jquery-1.11.3.js"></script>
     <script>
         //在onload事件中,所有页面内容(html,css,js,图片)加载后执行: 
         // 何时: 如果一个操作,必须等待css和图片加载后才能执行,应放在onload中
         window.onload=function(){alert("整个页面加载完成");}
     //在ready事件中显示DOM内容加载完成的时间html和js加载完毕,css未加载完都可以
         //如果一些初始化操作,不必等待css和图片,就可执行时,应放在DOMContentLoaded中提前执行:比如登陆注册
         $(function(){alert("Dom加载完成")});
     </script>
</head>
<body>
<h1>页面加载完成事件</h1>
<p>welcome to my first web page</p>


(责任编辑:陆柏熺)
评价:
用户名: 验证码: 看不清?点击更换


关注站长自媒体 获取更多优质内容

  • 百家号
    百家号
  • 头条号
    头条号
  • 企鹅号
    企鹅号

2019-2021 ©巅峰霸主网 京ICP备12023415号-2
返回
顶部