1、代码
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
<title>jquery的位置选择器一</title>
<!--引入jquery依赖包-->
<script type="text/javascript" src="../jquery-1.11.3.js"></script>
<script type="text/javascript">
$(function() {
//:first子元素过滤选择器
//li:first返回页面的最先的li项
//$("li:first").css("color","#f00");
//:last子元素过滤选择器
//li:last返回页面的最后的li项
//$("li:last").css("color","#f00");
//:first-child子元素过滤选择器
//li:first-child返回每个列表的最先的项
//$("li:first-child").css("color","#f00");
//:last-child子元素过滤选择器
//li:last-child返回每个列表的最后的项
//$("li:last-child").css("color","#f00");
//获取没有兄弟节点的<a>标签
//$("a:only-child").css("color","#f00");
});
</script>
</head>
<body>
<ul class="myList">
<li>
<a href="http://jquery.com">JQuery site</a>
<ul>
<li><a href="css1.txt" title="mycss">CSS1</a></li>
<li id="tt"><a href="css2.pdf" title="css2">CSS2</a></li>
<li><a href="css3.html" title="this is my">CSS3</a></li>
<li>Basic XPath</li>
</ul>
</li>
<li>
JQuery also supports
<ul>
<li>Custom selectors</li>
<li>Form selectors</li>
</ul>
</li>
</ul>
</body>
</html>
2、案例1
3、案例2
3、案例3
4、案例4
5、案例5