100字范文,内容丰富有趣,生活中的好帮手!
100字范文 > JS 两种在页面加载完成后自动执行的方法(ready onload)

JS 两种在页面加载完成后自动执行的方法(ready onload)

时间:2022-02-25 18:30:49

相关推荐

JS 两种在页面加载完成后自动执行的方法(ready onload)

JS,两种在页面加载完成后自动执行的方法

1.jQuery的ready事件,需要引入jQuery的包才能使用,表示文档结构已经加载完成(不包含图片等非文字媒体文件);

ready可以多次调用,可以绑定多个函数执行,在DOM文档结构加载完毕后,按照绑定顺序执行这些函数,后面函数不会覆盖前面函数的引用。

多种写法

$(function(){alert(do something); });$(function() {$("a").click(function() {alert("Hello world!");});})$(document).ready(function(){alert(do something); })$().ready(function(){alert(do something); )

2.onload,表示页面包含图片等文件在内的所有元素都加载完成,可以用在HTML的标签中,也可以用在JavaScript中。

一次只能保存对一个函数的引用,会自动用最后面的函数覆盖前面的函数。

//在JavaScript中window.onload=function(){//do something}//在<img>使用,图片元素载入完成后,执行某些动作document.getElementById("imgID").onload=function(){//do something}//在 HTML 中,通常用于 <body> 元素<body onload="JS方法名">

总结:这两个时间的执行顺序,是ready先于load执行,因为ready事件在DOM模型加载完以后就执行了,load事件要等到所有页面元素加载完毕后才执行。

(1) 解析HTML结构。(2) 加载外部脚本和样式表文件。(3) 解析并执行脚本代码。(4) 构造HTML DOM模型。//ready(5) 加载图片等外部文件。(6) 页面加载完毕。//load

弹出离职指引:

window.onload=function(){alert("请参见离职指引");}$().ready(function(){alert("请参见离职指引");})

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。