马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。
您需要 登录 才可以下载或查看,没有帐号?立即注册
x
1.事件
* ready() - 作用是类似于window.onload事件
* 写法
* $(document).ready(function(){});
* $().ready(function(){});
* $(function(){});
* ready与onload的区别
* ready具有以下特点:
* 具有简写形式
* 等待DOM节点树的内容加载完毕后,就执行(速度快)
* 一个HTML页面允许编写多个ready
* onload具有以下特点:
* 没有简写形式
* 必须等待HTML页面中所有内容都加载完毕后,才执行(速度慢)
* 一个HTML页面只能编写一个onload
例如:
- <!doctype html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <title>onload事件机制</title>
- <script src="jquery-1.11.3.js"></script>
- <script>
-
- $(function(){
- console.log($("#user").val());
- });
- </script>
- </head>
- <body>
- <input type="text" id="user" value="小龙女">
- </body>
- </html>
复制代码效果:
*$(function(){})与window.onload时间加载对比:
例如:
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <title>26_加载时间对比</title>
- <script src="jquery-1.11.3.js"></script>
- </head>
- <script>
- var startTime = new Date().getTime();
- $(function(){
- var endTime = new Date().getTime();
- console.log("ready : "+(endTime-startTime)+"ms");
- });
- window.onload = function(){
- var endTime = new Date().getTime();
- console.log("onload : "+(endTime-startTime)+"ms");
- }
- </script>
- <body>
- <img src="img/0.jpg" style="width:200px;height:200px;"/>
- </body>
- </html>
复制代码效果:
结果很明显,jQuery时间加载时间要短。
* jQuery的特点
* 链式操作 - jQuery几乎所有方法返回jQuery对象
* 具有相对完善的处理机制 - 不报错(undefined)
|