使用JQuery 加载页面时调用JS的实现方法


Posted in Javascript onMay 30, 2016

1,window.onload = function() {};

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

一、一般的加载页面时调用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");  
});

使用 $(document).ready() 的简写,同时内部的 jQuery 代码依然使用 $ 作为别名,而不管全局的 $ 为何。

jQuery 代码:

jQuery(function($) {
  // 你可以在这里继续使用$作为别名...
 });

以上这篇使用JQuery 加载页面时调用JS的实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery实现图片信息的浮动显示实例代码
Aug 28 Javascript
jquery带下拉菜单和焦点图代码分享
Aug 24 Javascript
基于jQuery实现仿搜狐辩论投票动画代码(附源码下载)
Feb 18 Javascript
JS获取IMG图片高宽的简单实例
May 17 Javascript
jQuery实现布局高宽自适应的简单实例
May 28 Javascript
通过AngularJS实现图片上传及缩略图展示示例
Jan 03 Javascript
JavaScript程序设计高级算法之动态规划实例分析
Nov 24 Javascript
用ES6的class模仿Vue写一个双向绑定的示例代码
Apr 20 Javascript
微信小程序云开发之使用云函数
May 17 Javascript
node.js命令行教程图文详解
May 27 Javascript
vue实现简单计算商品价格
Sep 14 Javascript
JavaScript中reduce()的用法
May 11 Javascript
Bootstrap开关(switch)控件学习笔记分享
May 30 #Javascript
jquery获取复选框checkbox的值实现方法
May 30 #Javascript
JS在onclientclick里如何控制onclick的执行
May 30 #Javascript
JS获取复选框的值,并传递到后台的实现方法
May 30 #Javascript
值得分享的轻量级Bootstrap Table表格插件
May 30 #Javascript
js获取所有checkbox的值的简单实例
May 30 #Javascript
一览画面点击复选框后获取多个id值的方法
May 30 #Javascript
You might like
使用MaxMind 根据IP地址对访问者定位
2006/10/09 PHP
PHP个人网站架设连环讲(二)
2006/10/09 PHP
PHP递归调用的小技巧讲解
2013/02/19 PHP
PHP Cookie的使用教程详解
2013/06/03 PHP
解析关于wamp启动是80端口被占用的问题
2013/06/21 PHP
php定时计划任务与fsockopen持续进程实例
2014/05/23 PHP
form自动提交实例讲解
2017/07/10 PHP
用javascript实现点击链接弹出"图片另存为"而不是直接打开
2007/08/15 Javascript
通过js简单实现将一个文本内容转译成加密文本
2013/10/22 Javascript
javascript实现带下拉子菜单的导航菜单效果
2015/05/14 Javascript
js替换字符串中所有指定的字符(实现代码)
2016/08/17 Javascript
JavaScript使用正则表达式获取全部分组内容的方法示例
2017/01/17 Javascript
JS获取本周周一,周末及获取任意时间的周一周末功能示例
2017/02/09 Javascript
利用JavaScript对中文(汉字)进行排序实例详解
2017/06/18 Javascript
vue中使用[provide/inject]实现页面reload的方法
2019/09/30 Javascript
js实现坦克移动小游戏
2019/10/28 Javascript
JS实现省市县三级下拉联动
2020/04/10 Javascript
Vue实现手机计算器
2020/08/17 Javascript
基于原生JS封装的Modal对话框插件的示例代码
2020/09/09 Javascript
vue实现lodop打印功能的示例
2020/11/11 Javascript
[50:04]DOTA2上海特级锦标赛D组小组赛#2 Liquid VS VP第二局
2016/02/28 DOTA
c++生成dll使用python调用dll的方法
2014/01/20 Python
python网络编程学习笔记(三):socket网络服务器
2014/06/09 Python
使用python实现正则匹配检索远端FTP目录下的文件
2015/03/25 Python
django限制匿名用户访问及重定向的方法实例
2018/02/07 Python
pycharm设置注释颜色的方法
2018/05/23 Python
python 寻找list中最大元素对应的索引方法
2018/06/28 Python
python安装pywin32clipboard的操作方法
2019/01/24 Python
如何利用Pyecharts可视化微信好友
2019/07/04 Python
求职信写作要突出重点
2014/01/01 职场文书
小学生演讲稿
2014/01/12 职场文书
关于工作经历的证明书
2014/10/11 职场文书
淮阳太昊陵导游词
2015/02/10 职场文书
2015年乡镇纪检工作总结
2015/04/22 职场文书
生产现场禁烟通知
2015/04/23 职场文书
opencv读取视频并保存图像的方法
2021/06/04 Python