JS:window.onload的使用介绍

 更新时间:2013年11月13日 15:46:24   作者:  
window.onload在某些情况下还是比较实用的,比如加载时执行哪些脚本等等,下面有几个不错的示例,需要的朋友可以参考下
1、最简单的调用方式
直接写到html的body标签里面,如:
复制代码 代码如下:

<html>
<body onload="func()">
</body>
</html>

2、在JS语句调用
复制代码 代码如下:

<script type="text/javascript">
function func(){……}
window.onload=func;
</script>

3、同时 调用多个函数
直接写到html的body标签里面,如:
复制代码 代码如下:

<html>
<body onload="func1();func2();func3();">
</body>
</html>

4、js调用多个函数,以下这种调用方式可以用于不太复杂的JS程序中,如果程序函数很多,逻辑比较复杂,可以考虑用第五种方式。
复制代码 代码如下:

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

5、JS自定义函数式多次调用
复制代码 代码如下:

<script type="text/javascript">
function func1(){……}
function func2(){……}
function func3(){……}
function addLoadEvent(func){
var oldonload=window.onload;
if(typeof window.onload!="function"){
window.onload=func;
}
else{
window.onload=function(){
oldonload();
func();
}
}
}
addLoadEvent(func1);
addLoadEvent(func2);
addLoadEvent(func3);
</script>

相关文章

  • 在线编辑器中换行与内容自动提取

    在线编辑器中换行与内容自动提取

    这几天在写在线编辑器,碰到个问题,当使用回车换行时不是你希望的<br>而是<p></p>对或是<div></div>对。使用google搜索,在网上找不到满意的答案。
    2009-04-04
  • 微信小程序实现富文本图片宽度自适应的方法

    微信小程序实现富文本图片宽度自适应的方法

    小程序里图片会显示不全,这时就应该做相应的处理,使小程序里图片显示正确,这篇文章主要介绍了微信小程序实现富文本图片宽度自适应的方法,感兴趣的小伙伴们可以参考一下
    2019-01-01
  • Phaser.js实现简单的跑酷游戏附源码下载

    Phaser.js实现简单的跑酷游戏附源码下载

    这篇文章主要介绍了Phaser.js实现简单的跑酷游戏附源码下载,需要的朋友可以参考下
    2018-10-10
  • 实现抖音两个旋转小球的loading技巧实例

    实现抖音两个旋转小球的loading技巧实例

    这篇文章主要为大家介绍了实现抖音两个旋转小球的loading技巧实例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-05-05
  • JavaScript实现简单图片翻转的方法

    JavaScript实现简单图片翻转的方法

    这篇文章主要介绍了JavaScript实现简单图片翻转的方法,涉及javascript操作图片与数组的相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-04-04
  • js对数组中的数字从小到大排序实现代码

    js对数组中的数字从小到大排序实现代码

    对数组中的数字从小到大排序,很多时候需要用的多,需要的朋友可以参考下
    2012-09-09
  • uni-app做微信小程序的分包处理方法

    uni-app做微信小程序的分包处理方法

    分包指的是把一个完整的小程序项目,按照不同的需求划分为不同的子包,在构建时打包成不同的分包,用户在浏览时按需加载,这篇文章主要介绍了uni-app做微信小程序的分包处理,需要的朋友可以参考下
    2023-02-02
  • JavaScript中判断数据类型的方法总结

    JavaScript中判断数据类型的方法总结

    这篇文章主要为大家详细介绍了一些JavaScript中判断数据类型的方法,文中的示例代码讲解详细,具有一定的学习价值,需要的小伙伴可以了解一下
    2023-07-07
  • JS实现的打字机效果完整实例

    JS实现的打字机效果完整实例

    这篇文章主要介绍了JS实现的打字机效果,结合完整实例形式分析了javascript定时触发自定义函数模拟打字输出效果的相关实现技巧,需要的朋友可以参考下
    2016-06-06
  • JS使用AudioContext实现音频流实时播放

    JS使用AudioContext实现音频流实时播放

    这篇文章主要为大家详细介绍了JavaScript如何使用AudioContext实现音频流实时播放功能,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下
    2024-01-01

最新评论