获取过滤点
方法 | 说明 |
first() | 获取第一个,示例 $('li').first() |
last() | 获取最后一个,示例$('li').last() |
eq() | 获取指定索引的节点,索引从0开始,示例$('li').eq(1),获取第二个li |
not() | 不包含某些,示例$('li').not("#d") |
filter() | 包含某些, 示例$("li").filter("#d"),未包含的未选取 |
<!DOCTYPE html>
<html> <head> <title>过滤节点</title> <meta charset="UTF-8"> <script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.3.1.min.js"></script> <style> .box{ border: 1px solid black; padding: 1px; margin-bottom: 12px; } </style> </head> <body> <div> <ul id="ul"> <li id="a">油条</li> <li id="b">包子</li> <li id="c">米饺</li> <li id="d"><a>鱼粉</a></li> </ul> </div> <script> $('li').first("#d").attr("class","box"); </script> </body></html><!DOCTYPE html>
<html> <head> <title>过滤节点</title> <meta charset="UTF-8"> <script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.3.1.min.js"></script> <style> .box{ border: 1px solid black; padding: 1px; margin-bottom: 12px; } </style> </head> <body> <div> <ul id="ul"> <li id="a">油条</li> <li id="b">包子</li> <li id="c">米饺</li> <li id="d"><a>鱼粉</a></li> </ul> </div> <script> $('li').last("#d").attr("class", "box"); </script> </body></html>
<!DOCTYPE html>
<html> <head> <title>过滤节点</title> <meta charset="UTF-8"> <script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.3.1.min.js"></script> <style> .box{ border: 1px solid black; padding: 1px; margin-bottom: 12px; } </style> </head> <body> <div> <ul id="ul"> <li id="a">油条</li> <li id="b">包子</li> <li id="c">米饺</li> <li id="d"><a>鱼粉</a></li> </ul> </div> <script> $('li').eq("#d").attr("class", "box"); </script> </body></html><!DOCTYPE html>
<html> <head> <title>过滤节点</title> <meta charset="UTF-8"> <script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.3.1.min.js"></script> <style> .box{ border: 1px solid black; padding: 1px; margin-bottom: 12px; } </style> </head> <body> <div> <ul id="ul"> <li id="a">油条</li> <li id="b">包子</li> <li id="c">米饺</li> <li id="d"><a>鱼粉</a></li> </ul> </div> <script> $('li').not("#d").attr("class", "box"); </script> </body></html><!DOCTYPE html>
<html><head><title>过滤节点</title><meta charset="UTF-8"><script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.3.1.min.js"></script><style>.box{ border: 1px solid black;padding: 1px;margin-bottom: 12px;}</style></head><body><div><ul id="ul"><li id="a">油条</li><li id="b">包子</li><li id="c">米饺</li><li id="d"><a>鱼粉</a></li></ul></div><script>$('li'). filter("#d").attr("class", "box");</script></body></html>