JS,jQuery加载后执行

1.加载后执行存在的意义

我们都知道页面的代码顺序是从上往下进行加载,很多时候我们要对页面中的某一个模块进行操作,这时候我们常常使用javascript代码来进行操作。为了能够保证操作的模块或对象在js代码之前就加载了,我们不得不把js代码放在页面的底端。但是我们在设计页面的时候,为了把js代码放在一起,或者一个让页面更加简洁的位置,那就有可能出现代码中操作的对象未被加载的情况,那么我们该如何去解决呢?这时候加载后执行就被有了存在的意义了。

2.$(document).ready(function(){ }) ($(function(){}是其简写)

    该方法在DOM树加载完成后就会执行(不包括媒体,图片资源),执行window.onload = function(){ }快得多,它是JQuery封装过的方法,其底层是window. addEventListener( ' DOMContentLoaded' , function(){})

3.window.onload = function(){} (JQuery写法: $(window).load)
 window.onload表示在页面资源载完成后能立即触发(比如图片和媒体资源,它们的加载速度远慢于DOM的加载速度),并且能够为该事件注册事件处理函数。将要对对象或者模块进行操作的代码存放在处理函数中。即:window.onload =function (){这里写操作的代码};

我的理解之这样的,接下来搬一分大佬的结论收藏:

       1. window.οnlοad=function(){}是等待所有的内容都加载完之后执行,比如图片,内容,js,css等。

  2. $(function(){}),是等待DOM加载完之后执行(我的理解是标签绘制完毕之后),图片未加载完时也能执行。

  3. $(function(){})是$(document).ready(function(){})的简写方式,功能是一样的。

  4. $(window).load(function (){})也是等待所有的内容都加载完之后执行。

  5. 不管是外链js还是页面中的js的window.onload都只执行最后的一个

  6. $(window).load(function (){})可以有多个,而且都是顺序执行。

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值