## 认识jQuery jQuery 的理念是：write less,do more。 jQuery 极大的简化了 javascript 开发人员遍历HTML文档、操作 DOM 、处理事件、执行动画和开发 Ajax 的操作。 ### 1.jQuery优势 1. 轻量级。压缩后可以保持在30kb左右。 2. 强大的选择器。可以使用CSS1-CSS3几乎所有选择器。 3. 出色的DOM操作的封装。 4. 可靠的事件处理机制。 5. 完善的Ajax。 6. 不污染顶级变量。jQuery只建立一个名为jQuery的对象，其所有的函数方法都在这个对象之下。 ### 2.使用jQuery jQuery 库文件一般有生产版和开发版。区别在于生产版经过了压缩，只有30kb左右，我们下载使用开发版就可以了。 使用时，在页面引入 jquery.js 库文件就可以使用了。 ~~~javascript <script type="text/javascript" src="js/jquery.js"></script> ~~~ **简单编写jQuery:** ~~~ $(document).ready(function(){ alert('Hello jQuery'); }); ~~~ window.onload方法和$(document).ready(）方法的区别。 * `window.onload`必须等待网页中所有内容加在完毕才能执行。 * `$(document).ready(）`是网页中所有DOM结构绘制完成后就执行，可能DOM元素关联的东西并没有加载。 **链式风格** ~~~ //等待dom元素加载完毕. $(document).ready(function(){ $(".level1 > a").click(function(){ $(this).addClass("current") //给当前元素添加"current"样式 .next().show() //下一个元素显示 .parent().siblings().children("a").removeClass("current") //父元素的兄弟元素的子元素<a>移除"current"样式 .next().hide(); //它们的下一个元素隐藏 return false;//事件处理阻止了默认的事件行为并停止了事件通过dom向上冒泡 }); }); ~~~