JavaScript:网站页面js请慎用onload事件

原创 2007年10月09日 11:34:00
又是一个关于js 执行顺序,执行入口的问题。
大家习惯于在window或者body上加上onload事件,在页面完全载入之后做一些操作。
因为,在页面没有载入完全之前去访问某些页面元素可能访问不到从而造成错误。
但这业务系统来讲是没有问题,而对于网站页面却不适合。
为什么呢?
因为常常并非网站页面的所有内容都是出于站内,你投放了广告代码、布了第三方的统计代码、调用了Alexa排名显示等等。
而这些js、iframe都是在其他域下,一旦这些js或者iframe的载入出现等待,那么你的onload事件将不会被调用,可能造成页面主逻辑受阻。

怎么解决?
如果你想访问页面元素,就把js写在元素所在位置之下即可。只是要注意不要写在被访问元素内部。
这也符合Yahoo Yslow高性能网站的一条规则Put Scripts at the Bottom

JS 页面加载触发事件 document.ready和onload的区别

document.ready和onload的区别——JavaScript文档加载完成事件 页面加载完成有两种事件: 一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件); ...
  • jdsxzhao
  • jdsxzhao
  • 2015年03月26日 10:27
  • 7368

onload js函数不执行的原因分析及解决方法

今天打开网站的时候,发现很多页面的信息都没有显示出来,仔细观察了之后,发现都是onload的js函数没有执行的原因。其实之前曾发现过这个情况,我以为是网站出了问题,然后采用多种方法试图让onload的...
  • lixingshi
  • lixingshi
  • 2016年06月16日 16:40
  • 2709

html 中页面的加载顺序以及window.onload 与body 标签里面的onload事件的对比

html 中页面的加载顺序以及window.onload 与body 标签里面的onload事件的对比。 情况一:head 、body 以及body 外面的window.onload采用匿名方法。 ...
  • tannongchun
  • tannongchun
  • 2017年03月17日 11:01
  • 1810

JS 页面加载触发事件 document.ready和window.onload的区别

document.ready和onload的区别——JavaScript文档加载完成事件 页面加载完成有两种事件: 一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件); ...
  • HY_358116732
  • HY_358116732
  • 2017年12月29日 10:59
  • 91

JS 页面加载触发事件 document.ready和window.onload的区别

转载于:https://www.cnblogs.com/feiyuhuo/p/5097385.html document.ready和onload的区别——JavaScript文档加...
  • u010597202
  • u010597202
  • 2017年11月27日 14:29
  • 54

js页面加载触发的事件 document.write 和document.onload的区别

document.ready和onload的区别——JavaScript文档加载完成事件 页面加载完成有两种事件: 一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件); 二是...
  • yyjourney
  • yyjourney
  • 2017年06月05日 10:40
  • 403

Web_JavaScript_页面多个window.onload需求问题解决;

特别说明:当页面出现多个window.onload时,就会出现意想不到的事情,比如后面的...
  • u011168154
  • u011168154
  • 2014年09月19日 09:55
  • 645

document.ready和onload的区别 ——JavaScript文档加载完成事件

document.ready和onload的区别 ——JavaScript文档加载完成事件页面加载完成有两种事件 一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件) 二是on...
  • sports2000
  • sports2000
  • 2016年06月30日 22:33
  • 380

document.ready和onload的区别----JavaScript文档加载完成事件(二)

页面加载完成有两种事件,一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件),二是onload,指示页 面包含图片等文件在内的所有元素都加载完成。(可以说:ready 在onload...
  • piaoxuan1987
  • piaoxuan1987
  • 2016年04月11日 22:23
  • 524

document.ready和onload的区别——JavaScript文档加载完成事件

页面加载完成有两种事件:   一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件);   二是onload,指示页面包含图片等文件在内的所有元素都加载完成。      ...
  • piaoxuan1987
  • piaoxuan1987
  • 2016年04月11日 21:51
  • 573
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:JavaScript:网站页面js请慎用onload事件
举报原因:
原因补充:

(最多只允许输入30个字)