通常我们需要在打开页面时加载脚本,这些脚本必须在页面加载完毕后才可以执行,因为这时候DOM才完整,可以利用window.onload确保这一点,如:
window.onload=firstFunction;
这脚本的意思是在页面完毕后执行firstFunction函数,但当有很多个函数需要在页面加载时执行呢?可能有人说可以这样:
window.onload=firstFunction;
window.onload=secondFunction;

但这样的话只会执行secondFunction函数。

Simon Willison Blog  上提供了完美的解决方案:

  1. function addLoadEvent(func) {
  2. var oldonload = window.onload;
  3. if (typeof window.onload != 'function') {
  4. window.onload = func;
  5. } else {
  6. window.onload = function() {
  7. if (oldonload) {
  8. oldonload();
  9. }
  10. func();
  11. }
  12. }
  13. }

func参数就是要加载的函数名(记得只是函数名,不需要括号),有多少个函数需要在页面Load后执行的话,就调用多少次上面那个经典函数,例如:
addLoadEvent(firstFunction);
addLoadEvent(secondFunction);
......

页面加载完毕执行多个JS函数的更多相关文章

  1. 实用脚本 - - addLoadEvent 页面加载完毕执行函数

    function addLoadEvent(func){ var oldonload = window.onload; if(typeof window.onload != "functio ...

  2. HTML页面加载完毕后运行的js

    Js方法:<script type=”text/javascript”> window.onload=function (){ var userName=”xiaoming”; alert ...

  3. 在HTML页面加载完毕后运行某个js

    js <script type="text/javascript"> window.onload=function(){ //执行} </script> j ...

  4. jq常用事件(on,blur,focus,change),js/jq等待图片(页面)加载完毕事件,js读取文件

    jq常用事件(on,blur,focus,change) // 方法一(推荐) $('.box').on( "click",function() {} ) $('.box').on ...

  5. js判断页面加载完毕方法

    判断页面加载完成这个方法是很常见的,下面有三个常用的方法,各有利弊. 一.纯js方法 // (1).页面所有内容加载完成执行 window.onload = function(){ } // (2). ...

  6. JS判断页面加载完毕

    //JS判断页面加载完毕,再隐藏加载效果层,一个简单的JS加载效果. document.onreadystatechange = function () { if (document.readySta ...

  7. 页面加载完毕后调用js方法进行布局操控 已实验

    页面加载完毕后调用js方法进行布局操控 已实验 $(function(){ var check1 = $("[id$=SMS]").is(':checked'); var bl=$ ...

  8. jQuery页面加载完毕事件及jQuery与JavaScript的比较

    1.jQuery概述 jQuery是一个JavaScript库,它集成了JavaScript.DOM.CSS和Ajax,简化了JavaScript编程,提倡write less, do more. 2 ...

  9. php页面加载完毕后再显示购买按钮

    php页面加载完毕后再显示购买按钮 $document.ready(function(){ $("#buybotton").show()})

随机推荐

  1. 不自动切换eclipse视图

    刚开始使用eclipse进行调试时,当弹出"Confir Perspective Switch"视图时,不小心点了“No”.以后每次debug的时候都不切换到debug视图. 后发 ...

  2. ThinkPad 禁用 触摸板

    执行 xinput wowk@wowk:~$ xinput ⎡ Virtual core pointer id=2 [master pointer (3)] ⎜ ↳ Virtual core XTES ...

  3. 《C++ Primer》之面向对象编程(二)

    构造函数和复制控制 每个派生类对象由派生类中定义的(非 static)成员加上一个或多个基类子对象构成,当我们构造.复制.赋值和撤销一个派生类对象时,也会构造.复制.赋值和撤销这些基类子对象. 构造函 ...

  4. 找最大重复次数的数和重复次数(C++ Pair)

    Problem A: 第一集 你好,世界冠军 Time Limit: 10 Sec  Memory Limit: 128 MBSubmit: 265  Solved: 50[Submit][Statu ...

  5. zend笔记

    ZEND_STRL(str)  等价于 (str), (sizeof(str)-1) ZEND_STRS(str)等价于 (str), (sizeof(str))

  6. Inno Setup入门(八)——有选择性的安装文件

    这主要使用[Components]段实现,一个演示的代码如下: [setup] ;全局设置,本段必须 AppName=Test AppVerName=TEST DefaultDirName=" ...

  7. spring XML格式

    使用spring遇见一个很坑的问题,在XML中 这样配置: <method name="newSoapParam2" parameters="java.lang.S ...

  8. nginx+php-fpm 的配置下,php的错误日志

    发现php 运行错误时,浏览器的网页上并没有输出php的错误日志.那php的错误日志在哪里呢? 发现在 /var/log/nginx/error.log文件中. 怎么样才能在浏览器的网页中输出php的 ...

  9. 【jsp 练习】 给定三角形三边判断是否能组成三角形及计算面积

    Test.java package package1; public class Test { double side1 = -1 , side2 = -1 , side3 = -1 , area = ...

  10. hdu 5536 xor题

    input 1<=T<=1000 3<=n<=1000 s1 s2 ... sn 0<=si<=10e9 最多十个样例n>=100 output max((a ...