一.遍历节点
1.DOM节点遍历
①通过儿子找父亲
语法:子元素.parentNode
注:儿子只能有一个亲父亲,所以返回的是元素节点,而不是集合。
②通过父亲找儿子
语法:父元素.children
注:父亲可以有任意多个儿子,所以返回的是一个集合,集合中每个元素都是亲儿子的元素节点。
2.jQuery节点遍历
①找亲父亲
语法:子元素.parent()
②找父辈元素
语法:子元素.parents(["选择器"])
注:如果设置了参数()该参数是一个CSS选择器),那么返回符合条件的父辈元素,
如果没有设置参数,那么直接返回所有的父辈元素。
③找亲儿子
语法:父元素.children(["选择器"])
④找子孙后代
语法:父元素.find("选择器")
注:如果选择器设置的为"*",代表返回所有的子孙后代元素。
⑤找所有兄弟
语法:兄弟元素.siblings(["CSS选择器"])
注:如果设置了参数(CSS选择器),那么就从所有的兄弟元素中指定的兄弟;
如果没有设置参数,那么找到的就是所有的兄弟。
⑥找上一个兄弟
语法:兄弟元素.prev()
⑦找前面所有兄弟元素
语法:兄弟元素.prevAll(["CSS选择器"])
注:如果设置了参数,那么就从前面所有的兄弟元素中找指定的元素;
如果没有设置参数,那么找到的就是前面所有的兄弟。
⑧找上一个兄弟
语法:兄弟元素.next()
⑨找后面所有的兄弟元素
语法:兄弟元素.nextAll(["CSS选择器"])
注:如果设置了参数,那么就从后面的所有兄弟元素中找指定的元素;
如果没有设置参数,那么找到的就是后面所有的兄弟元素。
二.遍历节点--过滤
(从一个jQuery对象中,找符合条件的元素)
1.找第一个元素
语法:jQuery对象.first()
2.找最后一个元素
语法:jQuery对象.last()
3.找指定索引位置元素
语法:jQuery对象.eq(索引)
4.找匹配CSS选择器条件的元素
语法:jQuery对象.filter("CSS选择器")
5.找CSS选择器条件之外的元素
语法:jQuery对象.not("CSS选择器")
注:"jQuery对象[索引]"和"jquery对象.get(索引)"返回的结果是DOM对象;
"jQuery对象.eq(索引)"返回的结果是jQuery对象。
三.$.each()方法
1.作用:$.each()用于遍历数组、js对象和jQuery对象。
2.语法:$.each(对象,function(参数1,参数2){//回调函数中需要执行的业务逻辑
})
参数1:如果遍历的是数组,那么指的是数组元素对应的索引;
如果遍历的是js对象,那么指的是js对象的属性名;
如果遍历的是jQuery对象,那么指的是jQuery对象集合的索引。
参数2:如果遍历的是数组,那么指的是索引对应的数组元素;
如果遍历的是js对象,那么指的就是js对象的属性值;
如果遍历的是jQuery对象,那么指的就是索引对应的DOM对象。
3.注意:
$.each()本质上就是做的循环遍历操作,如果想结束循环遍历可以用break;跳过某次循环遍历可用
continue;
四.链式语法
1.核心:①调用时,方法用完毕之后继续使用点语法调用别的方法。
②在每一个方法内部返回this
2 java中的接触到的链式语法
StringBuilder和StringBuffer
注:jQuery几乎所有方法都支持链式语法。