使用CSS选择文本节点

Question

我有以下HTML标记：

<h1> 

     <div class="sponsor"> 

          <span>Hello</span>  

     </div> 

     World 

</h1>

当我使用CSS选择器时，h1我得到了Hello World。

是否有我只能接受文本节点的CSS选择器？具体World在这个例子中？

编辑：

不幸的是，我不能更改标记，而只能使用CSS选择器，因为我使用的是聚合rss feed的系统。

Answer 1

CSS的当前状态无法执行此操作，请检查以下链接：W3C这里的问题是您写入屏幕的内容没有显示在DOM：P中。也::outside似乎还行不通（至少在Safari 6.0.3中对我来说），或者它根本还没有产生预期的结果。检查我的小提琴，然后检查DOM源：JSfiddle最后是属性选择器a { content: attr(href);}，使CSS能够读取DOM节点属性。似乎还没有innerHTML类似的东西。如果可能的话，那将是很好的选择，而您也许可以操纵标签的内部标记。

Answer 2

这几乎与我上周提出的问题相反：可以在不使用纯CSS的类或标识符的情况下，选择容器内的第一个元素（否则为纯文本）吗？最简洁的答案是不。"World"在此示例中，它不是其自身的元素-因此无法选择它。您在这里要做的是设置样式，h1然后使用覆盖样式div.sponsor。例如，如果您希望此处的“世界”具有黑色背景和白色文本，则可以使用类似以下内容的东西：h1 {&nbsp; &nbsp; background:black;&nbsp; &nbsp; color:white;}h1 div.sponsor {&nbsp; &nbsp; background:white;&nbsp; &nbsp; color:black;}不幸的是，但是，如果您只想要设置“ World”一词的样式，并且您的标记不仅仅包含<div>Hello</div> World Foo诸如之内的标记，那么这将是行不通的。我认为在这种情况下，纯CSS不可能仅将 “ World”设置为样式。

Answer 3

解决方法：h1 {&nbsp; color: red;}h1 * {&nbsp; color: lime;}<h1>&nbsp;&nbsp; &nbsp; &nbsp;<div class="sponsor">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span>Hello</span>&nbsp;&nbsp;&nbsp; &nbsp; &nbsp;</div>&nbsp;&nbsp; &nbsp; &nbsp;World&nbsp;</h1>