jQuery常用的基本过滤选择器
常用基本过滤选择器
手机品牌
- 苹果
- 华为
- vivo
电脑品牌
- 苹果
- 联想
- 戴尔
销量排行
- vivo
- 苹果
- 华为
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>常用基本过滤选择器</title>
<script src="scripts/jquery-3.1.1.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
//:first 选取所有满足的第一个
// text()弹出里面的文本
/* alert($("h3").text());
alert($("h3:first").text());*/
//last()选取所有满足的最后一个
//alert($("h3:last").text());
//not 排除掉括弧里面匹配到的内容就是要得到的
//alert($("li:not(ul li)").length);//3
//even 匹配下标是偶数的 下标从0开始 odd 匹配下标是奇数的
//alert($("li:even").text());
//eq(index) 符合的所有中的第一个
alert($("ol li:eq(0)").text());
//gt(index) 大于下标的全部
alert($("ol li:gt(0)").text());
//lt(index) 小于下标的全部
alert($("ol li:lt(1)").text());
});
</script>
</head>
<body>
<div>
<div id="div1">
<h3>手机品牌</h3>
<ul>
<li class="one">苹果</li>
<li>华为</li>
<li class="one">vivo</li>
</ul>
<h3>电脑品牌</h3>
<ul>
<li>苹果</li>
<li>联想</li>
<li>戴尔</li>
</ul>
</div>
<div>
<h3>销量排行</h3>
<ol>
<li>vivo</li>
<li>苹果</li>
<li>华为</li>
</ol>
</div>
</div>
</body>
</html>