jQuery基础知识点总结（必看）
jQuery是⼀个优秀的、轻量级的js库，它兼容CSS3，还兼容各种浏览器（IE 6.0+, FF1.5+, Safari 2.0+, Opera 9.0+），⽽jQuery2.0及后续版本将不再⽀持IE6/7/8浏览器。jQuery使⽤户能更⽅便地处理HTML（标准通⽤标记语⾔下的⼀个应⽤）、events、实现动画效果，并且⽅便地为⽹站提供AJAX交互。jQuery还有⼀个⽐较⼤的优势是，它的⽂档说明很全，⽽且各种应⽤也说得很详细，同时还有许多成熟的插件可供选择。
1、jQuery⼊⼝函数与Js⼊⼝函数的区别
【注】js⼊⼝函数指的是：load = function(){};
区别⼀：书写个数不同
Js⼊⼝函数只能出现⼀次，出现多次会存在事件覆盖的问题。
jQuery的⼊⼝函数，可以出现任意多次，并不会存在事件覆盖问题。
区别⼆：执⾏时机不同
Js⼊⼝函数是在所有的⽂件资源加载完成后，才执⾏。这些⽂件资源包括：页⾯⽂档、外部的js⽂件、外部的css⽂件、图⽚等。
jQuery的⼊⼝函数，是在⽂档加载完成后，就执⾏。⽂档加载完成指的是：DOM树加载完成后，就可以操作DOM了，不⽤等到所有的外部资源都加载完成。
⽂档加载的顺序：从上往下，边解析边执⾏。
2、jQuery对象和DOM对象的相互转换
①DOM对象此处指的是：使⽤js操作DOM返回的结果
var btn = ElementById(“btnShow”); // btn就是⼀个DOM对象
②jQuery对象此处指的是：使⽤jQuery提供的操作DOM的⽅法返回的结果
var $btn = $(“#btnShow”); // $btn就是⼀个jQuery对象
③DOM对象转换成jQuery对象
var $btn1 = $(btn); // 此时就把DOM对象btn转换成了jQuery对象$btn1
// $(document）.ready(function(){}); // 调⽤⼊⼝函数
// 此处是将document这个js的DOM对象，转换成了jQuery对象，然后才能调⽤jQuery提供的⽅法：ready
④jQuery对象转换成DOM对象
// 第⼀种⽅式
var btn1 = $btn[0]; // 此时就把jQuery对象$btn转换成了DOM对象btn1 （推荐使⽤此⽅式）
// 第⼆种⽅式
var btn2 = $(0);// 此时就把jQuery对象$btn转换成了DOM对象btn2
3、jQuery选择器
符号（名
称）
说明⽤法
基本选择器（重点）
#ID选择器$(“#btnShow”).css(“color”, “red”);
选择id为btnShow的⼀个元素（返回值为jQuery对象，下同）
.类选择器
$(“.liItem”).css(“color”, “red”);
选择含有类liItem的所有元素element标签选择器
$(“li”).css(“color”, “red”);
选择标签名为li的所有元素
层级选择器
$(“#j_wrap li”).css(“color”, “red”);
空格后代选择器
$(“#j_wrap li”).css(“color”, “red”);
选择id为j_wrap的元素的所有后代元素li
>⼦代选择器$(“#j_wrap > ul > li”).css(“color”, “red”);
选择id为j_wrap的元素的所有⼦元素ul的所有⼦元素li
基本过滤选择器
:eq(index)选择匹配到的元素中索引号为index的⼀个元素，index从0开始$(“li:eq(2)”).css(“color”, ”red”);
选择li元素中索引号为2的⼀个元素
:odd选择匹配到的元素中索引号为奇数的所有元素，index 从0开始$(“li:odd”).css(“color”, “red”);
选择li元素中索引号为奇数的所有元素
:even选择匹配到的元素中索引号为偶数的所有元素，index 从0开始$(“li:odd”).css(“color”, “red”);
选择li元素中索引号为偶数的所有元素
筛选选择器（⽅法）（重点）
find(selector)查指定元素的所有后代元素（⼦⼦孙孙）
$(“#j_wrap”).find(“li”).css(“color”, “red”);
选择id为j_wrap的所有后代元素li children()查指定元素的直接⼦元素（亲⼉⼦元素）
$(“#j_wrap”).children(“ul”).css(“color”,“red”);
选择id为j_wrap的所有⼦代元素ul siblings()查所有兄弟元素（不包括⾃⼰）
$(“#j_liItem”).siblings().css(“color”, “red”);
选择id为j_liItem的所有兄弟元素
parent()查⽗元素（亲的）jquery在一个元素后追加标签
$(“#j_liItem”).parent(“ul”).css(“color”,“red”);
选择id为j_liItem的⽗元素
eq(index)查指定元素的第index个元素，index是索引号，从0开始$(“li”).eq(2).css(“color”, “red”)；选择所有li元素中的第⼆个
以上这篇jQuery基础知识点总结(必看)就是⼩编分享给⼤家的全部内容了，希望能给⼤家⼀个参考，也希望⼤家多多⽀持。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。