锋利的Jquery学习笔记（1）
- Jquery库分两种，分别是Jquery1.3.1(18KB,Mimified and Gzipped)和jQuery1.3.1（114KB，Uncompressed)。
| 名称 | 大小 | 说明 |
| jQuery-1.3.1.js | 114KB | 完整无压缩版，主要用于测试、学习和开发 |
| jQuery-1.3.1.min.js | 54KB/18KB | 经过JSMin等工具压缩后的版本，大小为54KB。如果服务器开启Gzip压缩后，大小将变为只有18KB，主要用于产品和项目 |
2. 在页面中引用。
<head>
<script src="../script/jQuery-1.3.1.js" type="text/javascript"></script>
</head>
3. 编写第一简单的jQuery代码。
1 <html> 2 <head> 3 <meta http-equiv="Content-Type" content="text/html";charset="utf-8"/> 4 <title>this is jQuery test</title> 6 <script src="../script/jQuery-1.3.1.js" type="text/javascript"></script> 7 <script type="text/javascript"> 8 $(documnet).ready(function(){ 9 alert("Hello World“）; 10 }); 11 </script> 12 </head> 13 <body> 14 </body> 15 </html>
3. window.onload与$(document).ready()的对比。
| window.onload | $(document).ready() | |
| 执行时机 |
必须等待网页中所有的内容加载完毕后 （包括图片）才执行 |
网页中所有的DOM结构绘制完毕后就执行，可能DOM 元素关联的东西并没有加载完毕 |
| 编写个数 |
不能同时编写多个，如果存在多个，只 执行最后一个 window.onload=function(){ alert("Hello World"); }; |
能同时编写多个，并且都能执行。 $(document).ready(function(){ alert("Hello World"); }); |
| 简化写法 | 无 |
$(document).ready(function(){ //... }); 可以简写为： $(function(){ //... }); |
4. jQuery代码链式操作风格。
$(".has_children").click(function(){
$("this").addClass("highlight").children("a").show().end.siblings().removeClass("highlight").children("a").hide();
});
