如何复用window.onload

 时间:2026-02-14 01:40:31

1、每个页面加载完成后,只会发送一次onload事件,如果你写了多次,如:

window.onload = function1,

window.onload = function2,

这样并不会触发二次的调用,只会触发最后执行的一次,因为后面的会覆盖前惹政面的,

代码如图

如何复用window.onload

2、代码里,我们写了二个function, 分别在id为message1, message2的div里写入内容,(原内容是‘ ....空白....’),

页面加载完成后,可以看到只有function2有执行,(div里写入了内容),function1没有执行,还是原来的内容

如何复用window.onload

如何复用window.onload

3、那我罪边针们要怎么复用这个window.onload 事件呢,很简单,利用Jquery脚本库。

我们先引用脚本库文件。

(现在前端开发的都会使用一些脚本库陕离来开发,因为脚本库可以为我们实现封装了很多功能,我们不需要重复造轮子,不需要写很多重复的功能逻辑,只需要调用就行,而且很多功能都实现了跨浏览器的功能,我们不需要去做跨浏览器的兼容代码)

如何复用window.onload

4、在Jquery里,有个ready的方法,就是和原生Js脚本window.onload一样的作用,他意思就是当页面准备好了(加载完了),就触发你调用的方法。

而且他是可以多次调用,而不会覆盖的。代码如图:

如何复用window.onload

5、看下Jquery的源代码,可以发现, 他就是把ready方法添加到window onload事件里去的

如何复用window.onload

6、完整的代码如图,然后我们重新加载页面,可以看到,二个function都被执行了,成功的复用了onload事件。

如何复用window.onload

如何复用window.onload

  • DataGrip怎么设置数据编辑器优于ddl编辑器
  • 如何让div悬浮另一个div之上悬浮的div有透明度
  • Eclispe如何给类生成Junit测试类
  • 火车头如何采集文章,火车头教程
  • 如何通过js实现勾选复选框
  • 热门搜索
    learn怎么读 牙痛怎么办 海尔冰箱怎么样 october怎么读 海尔冰箱温度怎么调 怎么进入安全模式 结婚证丢了怎么离婚 酒精过敏怎么治疗 雅士利奶粉怎么样 f和弦怎么按