网页中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 flash下fromCharCode和charCodeAt方法使用说明
Jan 12 Javascript
Prototype ObjectRange对象学习
Jul 19 Javascript
JavaScript中的apply()方法和call()方法使用介绍
Jul 25 Javascript
javascript事件委托的方式绑定详解
Jun 10 Javascript
关于backbone url请求中参数带有中文存入数据库是乱码的快速解决办法
Jun 13 Javascript
JQuery对ASP.NET MVC数据进行更新删除
Jul 13 Javascript
微信小程序 开发指南详解
Sep 27 Javascript
node.js爬虫爬取拉勾网职位信息
Mar 14 Javascript
Vue组件开发之LeanCloud带图形校验码的短信发送功能
Nov 07 Javascript
js拖动滑块和点击水波纹效果实例代码
Oct 16 Javascript
Vue实现回到顶部和底部动画效果
Jul 31 Javascript
vue+vuex+axios从后台获取数据存入vuex,组件之间共享数据操作
Jul 31 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程序中使用adodb连接不同数据库的代码实例
2015/12/19 PHP
PHP session会话操作技巧小结
2016/09/27 PHP
PHP获取ttf格式文件字体名的方法示例
2019/03/06 PHP
laravel框架中视图的基本使用方法分析
2019/11/23 PHP
仅用[]()+!等符号就足以实现几乎任意Javascript代码
2010/03/01 Javascript
来自国外的14个图片放大编辑的jQuery插件整理
2010/10/20 Javascript
js 限制input只能输入数字、字母和汉字等等
2013/12/18 Javascript
javascript设计模式之解释器模式详解
2014/06/05 Javascript
jquery实现点击label的同时触发文本框点击事件的方法
2015/06/05 Javascript
JQuery validate插件Remote用法大全
2016/05/15 Javascript
微信小程序 animation API详解及实例代码
2016/10/08 Javascript
深入理解javascript的getTime()方法
2017/02/16 Javascript
vue结合Echarts实现点击高亮效果的示例
2018/03/17 Javascript
Node.js的Koa实现JWT用户认证方法
2018/05/05 Javascript
JS实现移动端触屏拖拽功能
2018/07/31 Javascript
Vue 使用Props属性实现父子组件的动态传值详解
2019/11/13 Javascript
简单了解Vue computed属性及watch区别
2020/07/10 Javascript
JS如何实现在弹出窗口中加载页面
2020/12/03 Javascript
python 域名分析工具实现代码
2009/07/15 Python
浅谈Scrapy框架普通反爬虫机制的应对策略
2017/12/28 Python
python微信聊天机器人改进版(定时或触发抓取天气预报、励志语录等,向好友推送)
2019/04/25 Python
通过实例简单了解Python sys.argv[]使用方法
2020/08/04 Python
英国领先的酒类网上商城:TheDrinkShop
2017/03/16 全球购物
什么是lambda函数
2013/09/17 面试题
土木工程专业自荐信
2013/10/04 职场文书
社区国庆节活动方案
2014/02/05 职场文书
调解协议书
2014/04/16 职场文书
公司承诺书格式
2014/05/21 职场文书
支部鉴定材料
2014/06/02 职场文书
2014年药品销售工作总结
2014/12/16 职场文书
怎样写观后感
2015/06/19 职场文书
小学生读书笔记
2015/07/01 职场文书
如何写新闻稿
2015/07/18 职场文书
python如何正确使用yield
2021/05/21 Python
一篇文章带你深入了解Mysql触发器
2021/08/02 MySQL
Go语言编译原理之变量捕获
2022/08/05 Golang