jquery文档查找

运用jquery需要导入jquery文件

<script  src = "jquery.js"> </script>

在body里写ul,ul里面包含6个li

<ul>
   <li>001</li>
   <li>002<i>我是斜体</i></li>
   <li>003</li>
   <li>004</li>
   <li>005</li>
   <li>006</li>
 </ul>

<script>

gt() lt() 索引都是从0开始

gt() 设置索引大于多少的所有标签

gt(3) 设置ul里面li 索引大于3的所有标签，背景颜色为red

$('ul li:gt(3)').css('backgroundColor','red')

如图:

lt() 设置索引小于多少的所有标签

lt(3)，设置索引小于3的标签

$('ul li:lt(3)').css('backgroundColor','blue')

如图:

filter( ) 过滤满足条件的标签

filter(’:gt(3)’) 过滤索引大于3的标签

$('ul li').filter(':gt(3)').css('backgroundColor','blue')

结果:

not() 非

not(’:gt(3)’) 不是索引大于3的标签(小于3)

$('ul li').not(':gt(3)').css('backgroundColor','pink')

结果:

has() 含有

给ul里面li中含有i标签设置背景颜色为yellow

$('ul li').has('i').css('backgroundColor'，'yellow')

结果：

find() 找到

找到ul里面的li标签里面的i标签设置背影颜色

$('ul li').find('i').css('backgroundColor','red')

结果：

last() 设置最后一个标签

找到ul里面的最后一个li标签

$('ul li).last().css('backgroundColor','red')

结果:

first() 设置第一个标签

设置ul 里面的li中第一个标签的背景颜色

$('ul li').first().css('backgroundColor','blue')

结果:

nth-child() 索引从1开始， prev()上一个标签

nth-child(3).prev() 设置第三个标签的上一个

$('ul li:nth-child(3)').prev().css('backgroundColor','red')

结果：

next() 下一个标签

nth-child(3).next()，设置第3个标签的下一个标签

$('ul li:nth-child(3)').next().css('backgroundColor','red')

结果：

prevAll() 设置上面所有的

设置第4个标签上面的所有标签背景色

$('ul li:nth-child(4)').prevAll().css('backgroundColor','yellow')

结果：

nextAll() 设置下面所有的

设置第4个标签下面所有的标签

$('ul li:nth-child(4)').nextAll().css('backgroundColor','yellow')

结果：

parent() 设置指定标签的父标签

设置第3个标签的父标签的背景色(li的父元素是ul)

$('ul li:nth-child(3)').parent().css('backgroundColor','red')

结果：

parents 设置所有的父标签

(li的父标签 ul body html)

$(ul li).parents().css('border','3px solid black')

结果：

siblings 兄弟 同级标签

设置第3个标签同级的标签

$('ul lli:nth-child(3)').siblings().css('backgroundColor','yellow')

结果：

children() 子节点

console.log($('ul li:nth-child(2)').children())

结果：标签节点

content() 文本节点 + 标签节点

console.log($('ul li:nth-child(2)').contents())

结果：

</script>