网页中JS函数自动执行常用三种方法


Posted in Javascript onMarch 30, 2016

本文为大家分享了在网页中JS函数自动执行常用方法,供大家参考,具体内容如下

一、JS方法
1.最简单的调用方式,直接写到html的body标签里面:

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

2.在JS语句调用:

<script type="text/javascript">
function myfun() 

{ 
 alert("this window.onload"); 
} 
/*用window.onload调用myfun()*/

window.onload = myfun;//不要括号
</script>

第三种

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

二、JQ方法

1.整个页面的document全部加载完成以后执行。不幸的这种方式不仅要求页面的DOM tree全部加载完成,而且要求所有的外部图片和资源全部加载完成。更不幸的是,如果外部资源,例如图片需要很长时间来加载,那么这个js方法执行感觉就比较慢了。也就是说这是一种最严谨的页面加载完再执行方法的方法。
window.onload =function() { $("table tr:nth-child(even)").addClass("even"); //这个是jquery代码 };

2.仅只需要加载所有的DOM结构,在浏览器把所有的HTML放入DOM tree之前就执行方法。包括在加载外部图片和资源之前。
$(document).ready(function() { $("table tr:nth-child(even)").addClass("even"); //任何需要执行的js特效 });

还有一种简写方式
$(function() { $("table tr:nth-child(even)").addClass("even"); //任何需要执行的js特效 });

在网页中JS函数自动执行常用三种方法

在HTML中的Head区域中,有如下函数:

<SCRIPT  LANGUAGE="JavaScript"> 

functionn MyAutoRun()


{ 


 //以下是您的函数的代码,请自行修改先!


 alert("函数自动执行哦!"); 


} 

</SCRIPT>

下面,我们就针对上面的函数,让其在网页载入的时候自动运行!

①第一种方法

将如上代码改为:

<SCRIPT  LANGUAGE="JavaScript"> 

functionn MyAutoRun()


{ 


 //以下是您的函数的代码,请自行修改先!


 alert("函数自动执行哦!"); 


} 


window.onload=MyAutoRun(); //仅需要加这一句

</SCRIPT>

②第二种方法

修改网页的Body为:

<body onLoad="MyAutoRun();">

或者改为:

<body onLoad="javascript:MyAutoRun();">

③第三种方法

使用JS定时器来间断性的执行函数:

setTimeout("MyAutoRun()",1000);   //隔1000毫秒就执行一次MyAutoRun()函数

实现方法,将最上面的那JS函数,改为:

<SCRIPT  LANGUAGE="JavaScript"> 

functionn MyAutoRun()


{ 


 //以下是您的函数的代码,请自行修改先!


 alert("函数自动执行哦!"); 


} 


setTimeout("MyAutoRun()",1000); //这样就行拉

</SCRIPT>

其它的方法比较特殊,也不常用,通用性也不大,就不介绍了!

以上为大家介绍的是JS函数自动执行常用方法,希望对大家的学习有所帮助。

Javascript 相关文章推荐
Javascript类库的顶层对象名用户体验分析
Oct 24 Javascript
javascript删除option选项的多种方法总结
Nov 22 Javascript
js如何设置在iframe框架中指定div不显示
Dec 04 Javascript
js取float型小数点后两位数的方法
Jan 18 Javascript
jQuery实现浮动层随浏览器滚动条滚动的方法
Sep 22 Javascript
基于javascript实现根据身份证号码识别性别和年龄
Jan 22 Javascript
超链接怎么正确调用javascript函数
May 23 Javascript
Javascript 普通函数和构造函数的区别
Nov 05 Javascript
JS实现的简单轮播图运动效果示例
Dec 22 Javascript
javascript实现圣旨卷轴展开效果(代码分享)
Mar 23 Javascript
JavaScript与Java正则表达式写法的区别介绍
Aug 15 Javascript
JavaScript封闭函数及常用内置对象示例
May 13 Javascript
Jquery轮播效果实现过程解析
Mar 30 #Javascript
修复jQuery tablesorter无法正确排序的bug(加千分位数字后)
Mar 30 #Javascript
JavaScript 经典实例日常收集整理(常用经典)
Mar 30 #Javascript
JavaScript 浏览器兼容性总结及常用浏览器兼容性分析
Mar 30 #Javascript
JavaScript 不支持 indexof 该如何解决
Mar 30 #Javascript
React.js入门学习第一篇
Mar 30 #Javascript
Node.js操作mysql数据库增删改查
Mar 30 #Javascript
You might like
PHP下获取上个月、下个月、本月的日期(strtotime,date)
2014/02/02 PHP
php有效防止图片盗用、盗链的两种方法
2016/11/01 PHP
laravel5实现微信第三方登录功能
2018/12/06 PHP
Laravel5框架自定义错误页面配置操作示例
2019/04/17 PHP
jQuery Div中加载其他页面的实现代码
2009/02/27 Javascript
javascript date格式化示例
2013/09/25 Javascript
jQuery Form插件使用详解_动力节点Java学院整理
2017/07/17 jQuery
pace.js和NProgress.js两个加载进度插件的一点小总结
2018/01/31 Javascript
React组件refs的使用详解
2018/02/09 Javascript
Vue.js实现图片的随意拖动方法
2018/03/08 Javascript
对vue下点击事件传参和不传参的区别详解
2018/09/15 Javascript
JavaScript数据结构与算法之检索算法实例分析【顺序查找、最大最小值、自组织查询】
2019/02/22 Javascript
利用Webpack实现小程序多项目管理的方法
2019/02/25 Javascript
js实现unicode码字符串与utf8字节数据互转详解
2019/03/21 Javascript
Vue请求java服务端并返回数据代码实例
2019/11/28 Javascript
vue使用keep-alive实现组件切换时保存原组件数据方法
2020/10/30 Javascript
python 2.6.6升级到python 2.7.x版本的方法
2016/10/09 Python
利用Python实现网络测试的脚本分享
2017/05/26 Python
Python 面试中 8 个必考问题
2018/11/16 Python
基于python的ini配置文件操作工具类
2019/04/24 Python
python验证身份证信息实例代码
2019/05/06 Python
python3中替换python2中cmp函数的实现
2019/08/20 Python
Python数据可视化:幂律分布实例详解
2019/12/07 Python
tensorflow 获取checkpoint中的变量列表实例
2020/02/11 Python
Python使用os.listdir和os.walk获取文件路径
2020/05/21 Python
联想香港官方网站及网店:Lenovo香港
2018/04/13 全球购物
签约仪式主持词
2014/03/19 职场文书
股指期货心得体会
2014/09/13 职场文书
2014年安全生产工作总结
2014/11/13 职场文书
2014年酒店工作总结与计划
2014/11/17 职场文书
2015商场元旦促销活动策划方案
2014/12/09 职场文书
庐山导游词
2015/02/03 职场文书
初中语文教学研修日志
2015/11/13 职场文书
股东出资协议书
2016/03/21 职场文书
CSS3 实现的图片悬停的切换按钮
2021/04/13 HTML / CSS
Win11 Beta 预览版 22621.575 和 22622.575更新补丁KB5016694发布(附更新内容大全)
2022/08/14 数码科技