使用CSS获取文本，但不针对同级元素
使用CSS获取文本，但不针对同级元素
提问于 2014-02-04 07:06:35
在下面的例子中，我试图以“59.00美元”为目标
<div class="ProductPriceRating">
<em>
<strike class="RetailPriceValue">$69.00</strike>
$59.00
</em>
</div>我有点被困在这上面了。
回答 2
Stack Overflow用户
回答已采纳
发布于 2014-02-04 07:09:09
除非您愿意更改DOM或愿意重写，否则不能这样做。
因此，要么需要使用span元素包装文本，而不是使用目标(如
div.ProductPriceRating > em > span {
}否则，如果不能更改DOM，则需要使用两个选择器，其中首先将样式应用于em，下一个选择器将使用strike覆盖
演示
div.ProductPriceRating > em {
color: red;
}
div.ProductPriceRating > em > strike {
color: black;
}您可以使用的另一种方式是:not，但是如果您使用的是color而不是继承，则会导致问题。
演示
div.ProductPriceRating em:not(.RetailPriceValue) {
background: red;
}正如您所评论的，您愿意使用jQuery，而不是这里，我们使用jQuery包装节点。
$(".ProductPriceRating em").contents().filter(function() {
return this.nodeType != 1; //or return this.nodeType == 3; <-- Preferable
}).wrap("<span></span>");演示
Stack Overflow用户
发布于 2014-02-04 07:52:10
jQuery怎么样？我可以用Jquery来锁定它，然后围绕它包装一个元素吗？
您可以选择文本节点并添加包装器，如下所示：
$('.ProductPriceRating')
.find("em")
.contents()
.filter(function() {
return this.nodeType === 3; // filter the text node
}).wrap("<span></span>");工作演示
CSS:
.ProductPriceRating span {
color: red;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/21546051
复制相关文章
相似问题
腾讯云开发者
