jQuery元素过滤

  

索引过滤

索引选择器是jQuery过滤选择器的一部分。与此同时,也存在功能相似的索引相关的方法,包括eq(),(),最后()

<强> eq()

eq()方法匹配元素的集合为指定的索引的哪一个元素.eq()方法可以接受一个整数作为参数,以0为基数。若整数为负数,则从集合中的最后一个元素开始计数

 & lt; script  src=" http://cdn.bootcss.com/jquery/1.12.4/jquery.min.js "祝辞& lt;/script> & lt; ul>
  ,,,& lt; li> list  item  1 & lt;/li>
  ,,,& lt; li> list  item  2 & lt;/li>
  ,,,& lt; li> list  item  3 & lt;/li>
  ,,,& lt; li> list  item  4 & lt;/li>
  ,,,& lt; li> list  item  5 & lt;/li> & lt;/ul> & lt; button  id=癰tn1祝辞按钮一& lt;/button> & lt; button  id=罢饫铩痹诎磁ザ? lt;/button> & lt; button  id=癰tn3祝辞按钮三& lt;/button> & lt; script> $ (' # btn1) .click(函数(){
  ,,,(李)美元.eq (0) . css(“边界”,“1 px  solid 红色”),,,,,
  })
  $(' #这里').click(函数(){
  ,,,(李)美元.eq (1) . css(“边界”,“1 px  solid 蓝色”),,,,,
  })
  $ (' # btn3 ') .click(函数(){
  ,,,(李)美元.eq (2) . css(“边界”,“1 px  solid 绿色”),,,,,
  })& lt;/script> 

<强>第()

第()方法获取匹配元素集合中第一个元素,该方法不接受参数

<强>最后()

最后()方法获取匹配元素集合中最后一个元素,该方法不接受参数

 & lt; script  src=" http://cdn.bootcss.com/jquery/1.12.4/jquery.min.js "祝辞& lt;/script> & lt; ul>
  ,,,& lt; li> list  item  1 & lt;/li>
  ,,,& lt; li> list  item  2 & lt;/li>
  ,,,& lt; li> list  item  3 & lt;/li>
  ,,,& lt; li> list  item  4 & lt;/li>
  ,,,& lt; li> list  item  5 & lt;/li> & lt;/ul> & lt; button  id=癰tn1祝辞按钮一& lt;/button> & lt; button  id=罢饫铩痹诎磁ザ? lt;/button> & lt; script> $ (' # btn1) .click(函数(){
  ,,,(李)美元当代(). css(“边界”,“1 px  solid 红色”),,,,,
  })
  $(' #这里').click(函数(){
  ,,,(李)美元.last () . css(“边界”,“1 px  solid 蓝色”),,,,,
  })& lt;/script> 

内容过滤

jQuery选择器中包括内容过滤选择器,而jQuery中也存在功能类似的内容过滤的方法,包括有()、过滤器(),(),(),(),地图切片()和()添加

<强>有()

有()方法用于筛选匹配元素集合中有相匹配的选择器或DOM元素的后代元素的父元素

 & lt; script  src=" http://cdn.bootcss.com/jquery/1.12.4/jquery.min.js "祝辞& lt;/script> & lt; ul>
  ,,,& lt; li> list  item  1 & lt;/li>
  ,,,& lt; li> list  item  2,,,, & lt; ul>
  ,,,,,& lt; li> list  item  2-a
  ,,,,,& lt; li> list  item  2-b
  ,,,& lt;/ul>
  ,,,& lt;/li>
  ,,,& lt; li> list  item  3 & lt;/li> & lt;/ul> & lt; button  id=癰tn祝辞按钮& lt;/button> & lt; script> $ (' # btn) .click(函数(){
  ,,,$(“李”). (ul) . css(“边界”,,“1 px  solid  lightblue”);
  })& lt;/script> 

<强>地图()

map()方法通过一个函数匹配当前集合中的每个元素

作为参数的函数有两个参数,第一个参照是匹配集合中的元素索引,第二个参数是当前索引的DOM元素对象

 & lt; script  src=" http://cdn.bootcss.com/jquery/1.12.4/jquery.min.js "祝辞& lt;/script> & lt; input  value=" https://www.yisu.com/zixun/text "祝辞& lt; input  value=" https://www.yisu.com/zixun/text "祝辞& lt; input  value=" https://www.yisu.com/zixun/text "祝辞& lt; button  id=癰tn祝辞按钮& lt;/button> & lt; script> $ (' # btn) .click(函数(){
  ,,,$(“输入”). map函数(指数(dom) {
  ,,,,,,,dom.value  +=,指数;
  ,,,});
  })& lt;/script> 

<强>过滤器()

过滤器()方法从匹配的元素集合中筛选出指定的元素,参数可以是一个选择器字符串,一个或多个DOM元素,jQuery对象或一个函数

 & lt; script  src=" http://cdn.bootcss.com/jquery/1.12.4/jquery.min.js "祝辞& lt;/script> & lt; ul>
  ,,,& lt; li> list  item  1 & lt;/li>
  ,,,& lt; li> list  item  2 & lt;/li>
  ,,,& lt; li> list  item  3 & lt;/li>
  ,,,& lt; li> list  item  4 & lt;/li>
  ,,,& lt; li> list  item  5 & lt;/li> & lt;/ul> & lt; button  id=癰tn祝辞按钮& lt;/button> & lt; script> $ (' # btn) .click(函数(){
  ,,,(李)美元.filter (': ') . css(“边界”,“1 px  solid  lightgreen”)
  })& lt;/script> 

jQuery元素过滤