jQuery基础入门与冲突解决

本篇笔记主要围绕jQuery学习展开，以《锋利的jQuery》一书为参考。首先，我们探讨了jQuery与DOM对象的区别与联系。 1. **jQuery对象和DOM对象**: - DOM对象是HTML文档的结构模型，它是JavaScript原生提供的，每个节点都代表文档中的一个元素，形成一棵树状结构。 - jQuery对象则是通过jQuery库对DOM对象进行封装，提供了简化、便捷的接口。jQuery对象并非DOM对象的子集，两者之间不能直接互换方法，但可通过特定方式互相转换。 2. **对象间的转换**: - 从jQuery对象到DOM对象，有以下两种方法： - 使用索引访问：例如`var cr = $("#cr")[0];` - jQuery提供的get方法：`var cr = $("#cr").get(0);` - 从DOM对象到jQuery对象，只需使用$()函数包裹：`var cr = document.getElementById("cr"); var $cr = $(cr);` 3. **处理库冲突**: - jQuery库的设计策略使得它与其他JavaScript库共存较为容易，因为大部分插件都在其命名空间内。全局变量$默认用于引用jQuery。 - 如果需要在其他库之后导入jQuery且避免冲突，可以使用`jQuery.noConflict()`函数将$的控制权移交给其他库，然后在需要使用jQuery的地方使用匿名函数或者立即执行函数表达式： ```javascript jQuery.noConflict(); // 将$的控制权移交给其他库 (function($) { // 使用jQuery $("p").click(function() { alert("..."); }); })(jQuery); // 将jQuery重命名为$ ``` 本笔记介绍了jQuery的基础概念，包括如何操作和转换DOM对象，以及如何在与其他JavaScript库共存时管理冲突。深入学习jQuery有助于提升前端开发效率，特别是处理DOM操作和事件处理时。《锋利的jQuery》是一本值得推荐的学习资源，读者可以通过它进一步深化理解和实践。