一、啥是jquery?
jquery是一个快速,简洁的JavaScript代码库
官网 : https://jquery.com/
二、jquery特点
1、 优质的选择器和筛选器 ;
2 、方便的隐式迭代 ;
3、 强大的链式编程;
三、jquery使用
3.1 必须下载并导入jQuery包 ,也就是 : jquery.js 或者 jquery.min.js
百度搜索: 静态资源库 ,在里面搜索jquery,然后可以选择合适的版本下载。
3.2 jquery的基础使用:
3.2.1 选择器 --- 用来获取DOM元素的方法
Id选择器 $("#box");
Class选择器 $(".box");
标签选择器 $("span");
包含选择器 $("#box p");
子选择器 $("#box>p");
群组选择器 $("#box,.cont,p");
属性选择器 $("input[type=button]");
特殊选择器 $("#box:first"); $("#box:last"); $("#box:eq(3)"); $("#box:odd"); $("#box:even");
3.2.2 筛选器方法 --- 对选择器获取到的一组标签对象进行筛选 --- 便于链式编程
.first() 匹配第一个
.last() 匹配最后一个
.eq() 匹配指定下标
.find() 匹配指定的后代元素
.children() 匹配指定的子元素
.prev() 匹配上一个兄弟
.prevAll() 匹配上面所有的兄弟
.next() 匹配下一个兄弟
.nextAll() 匹配下面所有兄弟
.siblings() 匹配所有兄弟,不管上下
.parent() 匹配直接父级
.parents() 匹配所有父级
.end() 匹配链式编程选择器的上一级
3.2.3 jq的ID选择器
·所有选择器选择出来的元素都以数组的形式返回;
·jq的DOM元素必须解析之后,才能使用原生js的DOM的属性或方法;
·jq的DOM元素,使用jq自身提供的方法,就不用解析;
原则上来说,原生jsDOM不能使用jq的DOM方法,
但是,原生jsDOM对象可以被转成jq的DOM对象, 这个时候就可以使用jq的方法了。
·原生js的DOM对象和jq的DOM对象的转换方式:
原生js转jq:
$(原生DOM对象);
jq转原生js:
jqDOM对象[0];