页面自动执行/加载js的几种方法

当我想在页面显示前就加载js,方法有以下几种:
例如你的js中已有一个函数为load();

1、直接写到html的body标签里面

代码如下:

<html> 
    <body onload="load();">
    </body> 
</html>

2、JS语句调用

<script type="text/javascript">
    function load()   {    
        ...... 
    }   
    // 不要括号
    window.onload = load;
</script>

3、Js调用 onload方法

<script type="text/javascript">
    window.onload = load(){
        func1();
        func2();
        func3(); 
    }
</script>

但第一种方法在我处理addclass(增加类名)时,显示效果有明显延迟。

附上使用jq的方法

window.onload =load() { 
    $("#id").addClass("even"); 
    //这个是jquery代码 
};

事先需要加载jquery,且是在页面加载完再执行方法。
另一种是在加载所有的DOM结构,在浏览器把所有的HTML放入DOM tree之前就执行方法

$(document).ready(function() { 
    $("#id").addClass("even"); 
});

一样的,需要事前加载jquery
上述方法可以简写为

$(function() { 
    $("#id").addClass("even"); 
    //任何需要执行的js特效
}
发表新评论
Gravatar图片显示区