前端开发

首页 > 前端开发 > javascript > JS如何实现文档加载完成后执行代码

JS如何实现文档加载完成后执行代码

分享到：

【字体：大中小】

2016-12-27
来源：网络
118
23
1

导读：
在执行某些操作的时候，需要当文档完全加载完成之后再去执行，否则可能出现意向不到的情况，先看一段代码实例: !DOCTYPEhtmlhtmlheadmetacharset=utf-8title自学php网/titlestyletype=text/cssdiv{wid...

在执行某些操作的时候，需要当文档完全加载完成之后再去执行，否则可能出现意向不到的情况，先看一段代码实例:





自学php网
 
div{ 
 width:200px; 
 height:200px; 
} 
 
 
document.getElementById("mytest").style.backgroundColor="#639";

以上代码的初衷是将div的背景颜色设置为#639，但是并未达到我们预期的效果，这是因为文档加载的时候代码是顺序执行的，当执行js的设置背景颜色代码的时候，还没有加载到指定的div，所以js语句根本没有获取到对象。代码修改如下:





自学php网
 
div{ 
 width:200px; 
 height:200px; 
} 
 
 
window.onload=function(){ 
 document.getElementById("mytest").style.backgroundColor="#639"; 
}

以上代码实现了预期的效果，这是因为将代码放到了一个函数中，而此函数用作了window.onload事件的事件处理函数。window.onload事件触发的条件是当前文档完全加载完成，当此事件被触发之后，就会执行它的事件处理函数，这样因为所有文档都已加载了，就不存在js语句无法获得对象的情况了。

分享到：

javascript动态添加删除tabs标签的方法
本文实例讲述了javascript动态添加删除tabs标签的方法。分享给大家供大家参考。具体实现方法如下：网页对话 function $(obj) { var o = typeof(obj)=="object" ? obj : document.getElementById(obj); return o; } function addChannel(ChannelId,LabelText){ var ChatBoardId="ChatBoard...

没有了！

前端开发

JS如何实现文档加载完成后执行代码

Tags

About