首页 > 试题广场 >

以下哪些事件会在页面加载完成（onload）之前触发？

[不定项选择题]
以下哪些事件会在页面加载完成（onload）之前触发？ 
  • readystatechange
  • pageshow
  • beforeunload
  • DOMContentLoaded
查看正确选项
添加回答
旺仔大馒头头像 旺仔大馒头

选择AD。

  1. A. readystatechange
    document有readyState属性来描述document的loading状态，readyState的改变会触发readystatechange事件.
    • loading
      文档仍然在加载
    • interactive
      文档结束加载并且被解析，但是像图片，样式，frame之类的子资源仍在加载
    • complete
      文档和子资源已经结束加载，该状态表明将要触发load事件。

因此readystatechange在onload之前触发。

  1. B.onpageshow
    onpageshow 事件在用户浏览网页时触发。
    onpageshow 事件类似于 onload 事件，onload 事件在页面第一次加载时触发， onpageshow 事件在每次加载页面时触发，即 onload 事件在页面从浏览器缓存中读取时不触发。

  2. C. beforeunload
    当浏览器窗口，文档或其资源将要卸载时，会触发beforeunload事件。这个文档是依然可见的，并且这个事件在这一刻是可以取消的.
    如果处理函数为Event对象的returnValue属性赋值非空字符串，浏览器会弹出一个对话框，来询问用户是否确定要离开当前页面（如下示例）。有些浏览器会将返回的字符串展示在弹框里，但有些其他浏览器只展示它们自定义的信息。没有赋值时，该事件不做任何响应。

  3. D.DOMContentLoaded
    当初始的 HTML 文档被完全加载和解析完成之后，DOMContentLoaded 事件被触发，而无需等待样式表、图像和子框架的完成加载。
    另一个不同的事件 load 应该仅用于检测一个完全加载的页面。因此DOMContentLoaded是HTML完全加载和解析完成之后发生的，发生时间点要早于load，选D。
    在使用 DOMContentLoaded 更加合适的情况下使用 load 是一个令人难以置信的流行的错误，所以要谨慎。
    注意：DOMContentLoaded 事件必须等待其所属script之前的样式表加载解析完成才会触发。

发表于 2019-08-19 11:14:08 回复(2)
异阳头像 异阳 
readystatechange 读取状态变化
pageshow 页面展示
beforeunload 页面退出
DOMContentLoaded dom内容加载完成
编辑于 2020-02-22 18:44:09 回复(0)
夏花爱秋叶头像 夏花爱秋叶
## web页面生命周期
* 根据链接的例子:[例子](http://www.html-js.com/article/4585)
1. 浏览器的一般加载顺序为(同步的script):
```
script executed;readyState:interative;DOMContentLoaded;image onload;iframe onload ;readyState:complete ;window:onload
```
2. 可以看出来:`同步的script总是先于其他事件执行，而window.onload事件总是最后执行，image/iframe的执行顺序总是在中间，具体是不固定的`
---
3. 需要记住:`同步的script总是先执行的，比DOMContentLoaded先执行`
4. 在DOM准备就绪之后(`也就是页面文档完全载入并且解析完成之后，仅仅是页面文档,不包括外部资源`)，DOMContentLoaded事件在document上触发，`我们在DOMContentLoaded阶段使用js操作DOM节点,这也意味着程序执行从同步脚本阶段转移到事件驱动阶段`
5. 在js脚本执行完毕之后，可能还有异步外部资源(iframe,img)在载入过程中
6. 网页所有资源都`载入完毕，才开始执行document.onload事件`
---
* 如果再细分，我们可以使用document.readyState来表示文档的当前状态
1. loading:文档正在载入
2. interactive:在DOMContentLoaded`之前`触发，相差时间很短
3. complete:在document.onload`之前`触发，相差时间很短，此时也已经完全加载所有资源

发表于 2019-11-16 16:07:28 回复(1)
牛客955794565号头像 牛客955794565号 
	

		一般浏览器的加载顺序如下：
	


	
    
		
		
  • 
			script executed
		

		
  • 
			readyState : interactive
		

		
  • 
			DOMContentLoaded
		

		
  • 
			image onload
		

		
  • 
			iframe onload
		

		
  • 
			readyState : complete
		

		
  • 
			window onload
		

	


	

		从以上可以看出同步的Script总是先于其它事件执行，而window.onload事件总是最后执行。而image onload和iframe onload的先后顺序并不确定。
编辑于 2021-09-14 19:54:53 回复(1)
是个小笨蛋头像 是个小笨蛋
  1. A. readystatechange
    document有readyState属性来描述document的loading状态，readyState的改变会触发readystatechange事件.
    • loading
      文档仍然在加载
    • interactive
      文档结束加载并且被解析，但是像图片，样式，frame之类的子资源仍在加载
    • complete
      文档和子资源已经结束加载，该状态表明将要触发load事件。

因此readystatechange在onload之前触发。

  1. B.onpageshow
    onpageshow 事件在用户浏览网页时触发。
    onpageshow 事件类似于 onload 事件，onload 事件在页面第一次加载时触发， onpageshow 事件在每次加载页面时触发，即 onload 事件在页面从浏览器缓存中读取时不触发。

  2. C. beforeunload
    当浏览器窗口，文档或其资源将要卸载时，会触发beforeunload事件。这个文档是依然可见的，并且这个事件在这一刻是可以取消的.
    如果处理函数为Event对象的returnValue属性赋值非空字符串，浏览器会弹出一个对话框，来询问用户是否确定要离开当前页面（如下示例）。有些浏览器会将返回的字符串展示在弹框里，但有些其他浏览器只展示它们自定义的信息。没有赋值时，该事件不做任何响应。

  3. D.DOMContentLoaded
    当初始的 HTML 文档被完全加载和解析完成之后，DOMContentLoaded 事件被触发，而无需等待样式表、图像和子框架的完成加载。
    另一个不同的事件 load 应该仅用于检测一个完全加载的页面。因此DOMContentLoaded是HTML完全加载和解析完成之后发生的，发生时间点要早于load，选D。
    在使用 DOMContentLoaded 更加合适的情况下使用 load 是一个令人难以置信的流行的错误，所以要谨慎。
    注意：DOMContentLoaded 事件必须等待其所属script之前的样式表加载解析完成才会触发。

发表于 2022-07-18 11:31:14 回复(0)
聪明的加菲猫求offer头像 聪明的加菲猫求offer
B.load事件之后出发。pagehide在unload事件之前触发。
发表于 2020-03-16 09:04:32 回复(0)
月亮眨眨眼睛头像 月亮眨眨眼睛
1、当 onload 事件触发时，页面上所有的DOM，样式表，脚本，图片，flash都已经加载完成了。 2、当 DOMContentLoaded 事件触发时，仅当DOM加载完成，不包括样式表，图片，flash。
发表于 2023-04-17 21:48:16 回复(0)
小夏夏^o^头像 小夏夏^o^
onload页面加载完成时触发，onpageshow页面显示时触发，onbeforeunload页面跳转前触发。
发表于 2020-11-06 00:15:45 回复(0)
提交观点

问题信息

系统工程师 运维工程师 2019 Javascript 360集团
来自：360公司-2019校...
上传者：小小
难度：
8条回答 8601浏览

热门推荐

相关试题

扫一扫，把题目装进口袋

求职之前，先上牛客

扫描二维码，进入QQ群

扫描二维码，关注牛客公众号