网页中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插入样式实现代码
Feb 22 Javascript
在js(jquery)中获得文本框焦点和失去焦点的方法
Dec 04 Javascript
javascript验证只能输入数字和一个小数点示例
Oct 21 Javascript
Jquery中$.get(),$.post(),$.ajax(),$.getJSON()的用法总结
Nov 14 Javascript
Jquery焦点与失去焦点示例应用
Jun 10 Javascript
javascript原型模式用法实例详解
Jun 04 Javascript
AngularJS 单元测试(二)详解
Sep 21 Javascript
JS实现的RC4加密算法示例
Aug 16 Javascript
jQuery中常用动画效果函数知识点整理
Aug 19 jQuery
详解Vue.js自定义tipOnce指令用法实例
Dec 19 Javascript
IE浏览器下JS脚本提交表单后,不能自动提示问题解决方法
Jun 04 Javascript
vue-simple-uploader上传成功之后的response获取代码
Sep 07 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
这东西价格,可以买几台TECSUN S-2000
2021/03/02 无线电
非常有用的9个PHP代码片段
2016/04/06 PHP
Laravel实现表单提交
2017/05/07 PHP
Laravel框架处理用户的请求操作详解
2019/12/20 PHP
PHP读取文件或采集时解决中文乱码
2021/03/09 PHP
js select常用操作控制代码
2010/03/16 Javascript
js word表格动态添加代码
2010/06/07 Javascript
如何屏蔽防止别的网站嵌入框架代码
2015/08/24 Javascript
jquery关于事件冒泡和事件委托的技巧及阻止与允许事件冒泡的三种实现方法
2015/11/27 Javascript
jQuery soColorPacker 网页拾色器
2016/06/22 Javascript
jQuery实现的placeholder效果完整实例
2016/08/02 Javascript
完美解决IE9浏览器出现的对象未定义问题
2016/09/29 Javascript
Node.js利用console输出日志文件的方法示例
2018/04/27 Javascript
如何使node也支持从url加载一个module详解
2018/06/05 Javascript
详解nodejs解压版安装和配置(带有搭建前端项目脚手架)
2018/12/06 NodeJs
Vue递归组件+Vuex开发树形组件Tree--递归组件的简单实现
2019/04/01 Javascript
Vue 通过公共字段,拼接两个对象数组的实例
2019/11/07 Javascript
[04:27]DOTA2官方论坛水友赛集锦
2013/09/16 DOTA
[41:20]2014 DOTA2华西杯精英邀请赛 5 24 NewBee VS DK
2014/05/26 DOTA
[05:00]第二届DOTA2亚洲邀请赛主赛事第三天比赛集锦.mp4
2017/04/04 DOTA
Python用zip函数同时遍历多个迭代器示例详解
2016/11/14 Python
pandas对指定列进行填充的方法
2018/04/11 Python
使用pandas对矢量化数据进行替换处理的方法
2018/04/11 Python
python爬虫之线程池和进程池功能与用法详解
2018/08/02 Python
python 检查文件mime类型的方法
2018/12/08 Python
python 对多个csv文件分别进行处理的方法
2019/01/07 Python
Python使用dict.fromkeys()快速生成一个字典示例
2019/04/24 Python
详解python opencv、scikit-image和PIL图像处理库比较
2019/12/26 Python
详解Django3中直接添加Websockets方式
2020/02/12 Python
Python+OpenCV实现图像的全景拼接
2020/03/05 Python
StubHub墨西哥:购买和出售您的门票
2016/09/17 全球购物
联想马亚西亚官方网站:Lenovo Malaysia
2018/09/19 全球购物
荷兰网上药店:Drogisterij.net
2019/09/03 全球购物
编写一子程序,将一链表倒序,即使链表表尾变表头,表头变表尾
2016/02/10 面试题
.NET面试题:什么是反射
2016/09/30 面试题
标枪加油稿
2015/07/22 职场文书