网页中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 相关文章推荐
含有CKEditor的表单如何提交
Jan 09 Javascript
js的隐含参数(arguments,callee,caller)使用方法
Jan 28 Javascript
JavaScript实现列出数组中最长的连续数
Dec 29 Javascript
JavaScript如何自定义trim方法
Jul 28 Javascript
在vue项目中引用Iview的方法
Sep 14 Javascript
原生JS实现手动轮播图效果实例代码
Nov 22 Javascript
深入Node TCP模块的理解
Mar 13 Javascript
vue图片加载失败时用默认图片替换的方法
Aug 29 Javascript
搭建Vue从Vue-cli到router路由护卫的实现
Nov 14 Javascript
jQuery实现获取多选框的值示例
Feb 07 jQuery
vue中echarts图表大小适应窗口大小且不需要刷新案例
Jul 19 Javascript
浅谈JavaScript中等号、双等号、 三等号的区别
Aug 06 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
关于Intype一些小问题的解决办法
2008/03/28 PHP
兼容性比较好的PHP生成缩略图的代码
2011/01/12 PHP
PHP获取当前页面完整URL的实现代码
2013/06/10 PHP
php对数组排序的简单实例
2013/12/25 PHP
php实现webservice实例
2014/11/06 PHP
PHP遍历目录函数opendir()、readdir()、closedir()、rewinddir()总结
2014/11/18 PHP
基于Laravel 多个中间件的执行顺序详解
2019/10/21 PHP
apycom出品的jQuery精美菜单破解方法
2011/02/18 Javascript
jQuery插件 selectToSelect使用方法
2013/10/02 Javascript
display和visibility的区别示例介绍
2014/02/26 Javascript
jQuery实现鼠标滑过链接控制图片的滑动展开与隐藏效果
2015/10/28 Javascript
vue中使用echarts制作圆环图的实例代码
2018/07/27 Javascript
vue组件开发之用户无限添加自定义填写表单的方法
2018/08/28 Javascript
React中阻止事件冒泡的问题详析
2019/04/12 Javascript
JS实现判断移动端PC端功能
2020/02/21 Javascript
解决antd Form 表单校验方法无响应的问题
2020/10/27 Javascript
[01:02:32]DOTA2-DPC中国联赛 正赛 iG vs PSG.LGD BO3 第二场 2月26日
2021/03/11 DOTA
python中pass语句用法实例分析
2015/04/30 Python
对python 多个分隔符split 的实例详解
2018/12/20 Python
python使用PyQt5的简单方法
2019/02/27 Python
在python中将list分段并保存为array类型的方法
2019/07/15 Python
对Python _取log的几种方式小结
2019/07/25 Python
基于django ManyToMany 使用的注意事项详解
2019/08/09 Python
Python实现多线程/多进程的TCP服务器
2019/09/03 Python
Python 实现Image和Ndarray互相转换
2020/02/19 Python
使用Pycharm分段执行代码
2020/04/15 Python
Hunter Boots美国官方网站:赫特威灵顿雨靴
2018/06/16 全球购物
新加坡一家在线男士皮具品牌:Faire Leather Co.
2019/12/01 全球购物
彪马法国官网:PUMA法国
2019/12/15 全球购物
.NET程序员的数据库面试题
2012/10/10 面试题
艺术设计专业个人求职信范文
2013/12/11 职场文书
英语求职信范文
2014/05/23 职场文书
教师党员自我剖析材料
2014/09/29 职场文书
服务员岗位职责范本
2015/04/09 职场文书
公司员工宿舍管理制度
2015/08/07 职场文书
zabbix监控mysql的实例方法
2021/06/02 MySQL