jquery加载页面的方法(页面加载完成就执行)


Posted in Javascript onJune 21, 2011

1、$(function(){

$("#a").click(function(){

//adding your code here

});
});
2、$(document).ready(function(){

$("#a").click(function(){

//adding your code here


});
});
3、window.onload = function(){

$("#a").click(function(){

//adding your code here

});
}
html代码为<input type="button" id="a">点击</input>,且页面需要引用jquery的js文件

一般的加载页面时调用js方法如下:

window.onload = function() {
$("table tr:nth-child(even)").addClass("even"); //这个是jquery代码
};

这段代码会在整个页面的document全部加载完成以后执行。不幸的这种方式不仅要求页面的DOM tree全部加载完成,而且要求所有的外部图片和资源全部加载完成。更不幸的是,如果外部资源,例如图片需要很长时间来加载,那么这个js效果就会让用户感觉失效了。

但是用jquery的方法:

$(document).ready(function() {

// 任何需要执行的js特效
$("table tr:nth-child(even)").addClass("even");
});

就仅仅只需要加载所有的DOM结构,在浏览器把所有的HTML放入DOM tree之前就执行js效果。包括在加载外部图片和资源之前。

还有一种简写的方式:

$(function() {

// 任何需要执行的js特效
$("table tr:nth-child(even)").addClass("even");
});

Javascript 相关文章推荐
JS小框架 fly javascript framework
Nov 26 Javascript
jquery下checked取值问题的解决方法
Aug 09 Javascript
用RadioButten或CheckBox实现div的显示与隐藏
Sep 21 Javascript
js字符串转成JSON
Nov 07 Javascript
Javascript的&amp;&amp;和||的另类用法
Jul 23 Javascript
JavaScript实现打字效果的方法
Jul 10 Javascript
JavaScript来实现打开链接页面的简单实例
Jun 02 Javascript
Node.js环境下编写爬虫爬取维基百科内容的实例分享
Jun 12 Javascript
再次谈论Javascript中的this
Jun 23 Javascript
js 创建对象 经典模式全面了解
Aug 16 Javascript
Jquery EasyUI Datagrid右键菜单实现方法
Dec 30 Javascript
Angularjs之ngModel中的值验证绑定方法
Sep 13 Javascript
jquery一般方法介绍 入门参考
Jun 21 #Javascript
jquery操作select option 的代码小结
Jun 21 #Javascript
jquery随意添加移除html的实现代码
Jun 21 #Javascript
基于Jquery实现表格动态分页实现代码
Jun 21 #Javascript
基于jquery实现的表格分页实现代码
Jun 21 #Javascript
jquery异步请求实例代码
Jun 21 #Javascript
读jQuery之九 一些瑕疵说明
Jun 21 #Javascript
You might like
德生H-501的评价与改造
2021/03/02 无线电
解密ThinkPHP3.1.2版本之模板继承
2014/06/19 PHP
PHP编程计算日期间隔天数的方法
2017/04/26 PHP
PHP微信企业号开发之回调模式开启与用法示例
2017/11/25 PHP
php使用imagecopymerge()函数创建半透明水印
2018/01/25 PHP
javascript学习笔记(八) js内置对象
2012/06/19 Javascript
Get中文乱码IE浏览器Get中文乱码解决方案
2013/12/26 Javascript
js中setTimeout()与clearTimeout()用法实例浅析
2015/05/12 Javascript
js控制网页前进和后退的方法
2015/06/08 Javascript
jQuery validate插件功能与用法详解
2016/12/15 Javascript
基于BootStrap栅格栏系统完成网站底部版权信息区
2016/12/23 Javascript
Bootstrap模态框使用详解
2017/02/15 Javascript
浅谈Vue 初始化性能优化
2017/08/31 Javascript
node.js中http模块和url模块的简单介绍
2017/10/06 Javascript
原生JS实现的雪花飘落动画效果
2018/05/03 Javascript
对angular4子路由&amp;辅助路由详解
2018/10/09 Javascript
了解重排与重绘
2019/05/29 Javascript
微信小程序swiper禁止用户手动滑动代码实例
2019/08/23 Javascript
在Python中操作列表之List.pop()方法的使用
2015/05/21 Python
Python实现的快速排序算法详解
2017/08/01 Python
基于Django模板中的数字自增(详解)
2017/09/05 Python
Python实现曲线拟合操作示例【基于numpy,scipy,matplotlib库】
2018/07/12 Python
python pands实现execl转csv 并修改csv指定列的方法
2018/12/12 Python
numpy库与pandas库axis=0,axis= 1轴的用法详解
2019/05/27 Python
Tensorflow获取张量Tensor的具体维数实例
2020/01/19 Python
Python selenium页面加载慢超时的解决方案
2020/03/18 Python
python多进程使用函数封装实例
2020/05/02 Python
详解Python中的GIL(全局解释器锁)详解及解决GIL的几种方案
2021/01/29 Python
css3 position fixed固定居中问题解决方案
2014/08/19 HTML / CSS
创业计划书的内容步骤和要领
2014/01/04 职场文书
公民授权委托书
2014/10/15 职场文书
企业党的群众路线教育实践活动学习心得体会
2014/10/31 职场文书
雨花台导游词
2015/02/06 职场文书
总经理检讨书范文
2015/02/16 职场文书
小兵张嘎电影观后感
2015/06/03 职场文书
使用 JavaScript 制作页面效果
2021/04/21 Javascript