JavaScript判断页面加载完之后再执行预定函数的技巧.pdfVIP

这篇文章主要介绍了 JavaScript 判断页面加载完之后再执行预定函数的技巧 ,原理还是 利用监听器监听元素事件、被触发则执行函数 ,需要的朋友可以参考下 JavaScript 脚本语言的执行，是需要触发的。一般的做法就是在网页中，直接编写几个 函数，有的在代码被加载的时候就被浏览器处理， 或者使用类似下面的代码来触发实现函数 的相关功能。 lt;div id= ”link ” onclick= ”fun() ” gt;lt;/divgt; 上面代码的意思就是， 当鼠标点击 id 为 link 的元素的时候， 就触发了它的 onclick 事 件，然后执行使用 JavaScript 定义的 fun 函数。这样的做法肯定是很不合理的，因为触发 操作直接写进了 HTML 结构里面， 内容和行为没有隔离开， 对日后的二次开发或者修改带 来不便。 需要注意的是， 当事件处理与对应元素绑定起来的时候， 只有在那个元素加载完之后才 能进行操作。 如果说把处理的脚本放在了 head 区域，浏览器会报错。 因为下面的 HTML 元 素还没有加载出来， head 中的处理脚本已经被处理了。 一个好的执行 JavaScript 代码的方法应该是 行为内容分离的、 在页面加载后处理 的。 所以，处理 JavaScript 代码我们要用到 监听器 和 window 对象的 load 事件。 监听器 监听器实际上的功能就是行为与内容分离的。 以前需要在 HTML 中加上一些触发事件 来触发 JavaScript 的相关函数，而现在直接在 JavaScript 中对某个元素的使用监听器，监 听这个元素的事件， 如果这个元素被触发了某些事件， 在监听器中又定义了这个事件对应的 处理函数，那么就会处理这个函数。 W3C 的标准方法叫做 addEventListener ，被 IE9 ，chrome ，firefox ，opera 所支持，写 法： window.addEventListener( ‘load,function,false); 早期 IE 中有 attachEvent 方法效果类似： window.attachEvent( ‘onload,function); 使用监听器的方法也很简单， 就是先获取页面中的某个元素， 然后对这个元素使用监听 器，定义监听的事件和对应的事件处理函数，就上文例子： document.getElementById( ‘link).addEventListener( ‘click,fun,false); 关于监听器更加详细的使用说明，请见文末补充资料。 window.onload 事件 onload 事件只有在整个页面已经完全载入的时候才会被触发，我们将 JavaScript 代码 写进 onload 事件中，就可以保证在 HTML 元素被加载完成之后，浏览器才会处理我们的 JavaScript 代码。基础的写法： window.onload = function(){ nbsp;//code } 这样，这个函数里面的 code 会在加载完成之后被处理。但是，这种方法有个缺陷，就 是只能用于这一个函数。 页面中无法出现多个 window.onload 事件，如果出现了多个 onload 事件，那么后面的内容会覆盖前面的。 那么，我们可以这样做，在一个 window.onload 事件中，写上所有需要加载的函数名， 然后在外面定义函数： window.onload = funct