How can I select the last element with a specific class, not last child inside of parent?(如何选择具有特定类的最后一个元素,而不是父级中的最后一个子元素?)
本文介绍了如何选择具有特定类的最后一个元素,而不是父级中的最后一个子元素?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
<div class="commentList">
<article class="comment " id="com21"></article>
<article class="comment " id="com20"></article>
<article class="comment " id="com19"></article>
<div class="something"> hello </div>
</div>
我要选择#com19
?
.comment {
width:470px;
border-bottom:1px dotted #f0f0f0;
margin-bottom:10px;
}
.comment:last-child {
border-bottom:none;
margin-bottom:0;
}
只要我有另一个div.something
作为commentList中实际的最后一个子级,这就不起作用。在这种情况下,是否可以使用最后一个子项选择器来选择article.comment
的最后一个外观?
jsFiddle
推荐答案
:last-child
仅当有问题的元素是容器的最后一个子级时才有效,而不是特定类型的元素的最后一个子级。为此,您需要:last-of-type
http://jsfiddle.net/C23g6/3/
根据@BoltClock的注释,这只检查最后一个article
元素,而不是类为.comment
的最后一个元素。
body {
background: black;
}
.comment {
width: 470px;
border-bottom: 1px dotted #f0f0f0;
margin-bottom: 10px;
}
.comment:last-of-type {
border-bottom: none;
margin-bottom: 0;
}
<div class="commentList">
<article class="comment " id="com21"></article>
<article class="comment " id="com20"></article>
<article class="comment " id="com19"></article>
<div class="something"> hello </div>
</div>
这篇关于如何选择具有特定类的最后一个元素,而不是父级中的最后一个子元素?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
沃梦达教程
本文标题为:如何选择具有特定类的最后一个元素,而不是父级中的最后一个子元素?


猜你喜欢
- 为什么我的页面无法在 Github 上加载? 2022-01-01
- 是否可以将标志传递给 Gulp 以使其以不同的方式 2022-01-01
- 如何向 ipc 渲染器发送添加回调 2022-01-01
- 从原点悬停时触发 translateY() 2022-01-01
- 在不使用循环的情况下查找数字数组中的一项 2022-01-01
- 使用 iframe URL 的 jQuery UI 对话框 2022-01-01
- 为什么悬停在委托事件处理程序中不起作用? 2022-01-01
- 如何显示带有换行符的文本标签? 2022-01-01
- 我不能使用 json 使用 react 向我的 web api 发出 Post 请求 2022-01-01
- 如何调试 CSS/Javascript 悬停问题 2022-01-01