使用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 相关文章推荐
JavaScript 学习笔记一些小技巧
Mar 28 Javascript
Jquery多选下拉列表插件jquery multiselect功能介绍及使用
May 24 Javascript
JS执行删除前的判断代码
Feb 18 Javascript
用简洁的jQuery方法toggleClass实现隔行换色
Oct 22 Javascript
JavaScript+CSS实现的可折叠二级菜单实例
Feb 29 Javascript
JS实现的自定义水平滚动字体插件完整实例
Jun 17 Javascript
jquery轮播的实现方式 附完整实例
Jul 28 Javascript
node.js报错:Cannot find module 'ejs'的解决办法
Dec 14 Javascript
jQuery实现仿京东防抖动菜单效果示例
Jul 06 jQuery
vue实现记事本功能
Jun 26 Javascript
JS使用H5实现图片预览功能
Sep 30 Javascript
Vue实现多页签组件
Jan 14 Vue.js
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
php程序总是提示验证码输入有误解决方案
2015/01/07 PHP
php登录超时检测功能实例详解
2017/03/21 PHP
js 单引号 传递方法
2009/06/22 Javascript
jquery实现ajax提交form表单的方法总结
2014/03/03 Javascript
JavaScript 学习笔记之变量及其作用域
2015/01/14 Javascript
基于jquery实现图片相关操作(重绘、获取尺寸、调整大小、缩放)
2015/12/25 Javascript
JavaScript 定时器 SetTimeout之定时刷新窗口和关闭窗口(代码超简单)
2016/02/26 Javascript
jQuery实现日期联动效果实例
2016/07/26 Javascript
jQuery中$.ajax()方法参数解析
2016/10/22 Javascript
Vue.js开发环境搭建
2016/11/10 Javascript
jquery实现点击页面回到顶部
2016/11/23 Javascript
基于VUE.JS的移动端框架Mint UI的使用
2017/10/11 Javascript
vue 录制视频并压缩视频文件的方法
2018/07/27 Javascript
小程序清理本地缓存的方法
2018/08/17 Javascript
vue动态添加路由addRoutes之不能将动态路由存入缓存的解决
2019/02/19 Javascript
解决VueCil代理本地proxytable无效报错404的问题
2020/11/07 Javascript
python将多个文本文件合并为一个文本的代码(便于搜索)
2011/03/13 Python
python基础教程之实现石头剪刀布游戏示例
2014/02/11 Python
利用ctypes提高Python的执行速度
2016/09/09 Python
Python模拟简单电梯调度算法示例
2018/08/20 Python
Python3.5 处理文本txt,删除不需要的行方法
2018/12/10 Python
Python实现html转换为pdf报告(生成pdf报告)功能示例
2019/05/04 Python
Django REST framework 分页的实现代码
2019/06/19 Python
win10从零安装配置pytorch全过程图文详解
2020/05/08 Python
jupyter notebook运行命令显示[*](解决办法)
2020/05/18 Python
python实现图片转字符画的完整代码
2021/02/21 Python
基于CSS3 animation动画属性实现轮播图效果
2017/09/12 HTML / CSS
澳大利亚正品化妆品之家:Cosmetic Capital
2017/07/03 全球购物
新秀丽官方旗舰店:Samsonite拉杆箱、双肩包、皮具
2018/03/05 全球购物
波兰汽车配件网上商店:iParts.pl
2020/09/08 全球购物
如何设定的weblogic的热启动模式(开发模式)与产品发布模式
2012/09/08 面试题
干部年终考核评语
2015/01/04 职场文书
推广普通话宣传标语口号
2015/12/26 职场文书
Rust 连接 PostgreSQL 数据库的详细过程
2022/01/22 PostgreSQL
Mysql忘记密码解决方法
2022/02/12 MySQL
浅析Python OpenCV三种滤镜效果
2022/04/11 Python