jQuery.获取过滤点

获取过滤点


 

 方法  说明
 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>

 

posted @ 2018-07-23 16:00  HL()  阅读(210)  评论(0编辑  收藏  举报