用$("ol :last-child")时，除了第一个li的橘子，其它都加了背景色了，这是为什么？
<!DOCTYPE html>
<html>
<head>
<title>:last-child子元素过滤选择器</title>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<h3>改变每个"蔬菜水果"中最后一行的背景色</h3>
<ol>
<li>芹菜</li>
<li>茄子</li>
<li>萝卜</li>
<li>大白菜</li>
<li>西红柿</li>
</ol>
<ol>
<li>橘子</li>
<li>香蕉</li>
<li>葡萄</li>
<li>苹果</li>
<li>西瓜</li>
</ol>
<ol>
<li>橘子</li>
<li>香蕉</li>
<li>葡萄</li>
<li>苹果</li>
<li>西瓜</li>
<h6>最后一个</h6>
</ol>
<script type="text/javascript">
// $("li:last-child").css("background-color", "blue");
$("ol :last-child").css("background-color", "blue");
</script>
</body>
</html>当然，如果$("ol :last-child")里面指定li或者h6除外。
雨宮奏浏览 1488回答 3
3回答
-
淡雅的默
代码不全，看不出来，样式不贴出来什么鬼；根据提供的内容，如果网页只有一个ol，那么正确的应该是把Ol的背景变成蓝色，而不是H6标签，但是你给了这么一点代码，直接是给了h6的背景 -
qq_袁佳清_0
你的这个情况我之前也遇到了，不过我用的是frist-child 。 li:last-child 不能选最后一个<li>西瓜</li>，应该是代码把h6也当成 li 标签了，而你给 li 加样式 ，并没有给h6加所以不显示背景。 你可以把h6放中间，用 eq() 或者 nth-child() ,用个数的方式去选，它会占一位，但是前面给 li 加样式，它就不能显示 -
qq_袁佳清_0
我试着是正常的， <li>西红柿</li> <li>西瓜</li> <h6>最后一个</h6> 这些加了背景
随时随地看视频慕课网APP
相关分类
JQuery