CSS或jQuery選擇排除子

Question

如何選擇標題，但沒有字幕的位置：

<h1 id="banner"> 
This is the Title 
<span id="subtitle">and the subtitle</span> 
</h1> 

我想這樣做

h1 < span#subtitle {font-weight:bold} 

或

h1:not(#subtitle) {font-weight:bold} 

Answer 1

只提取標題文本，而不是字幕，使用以下命令：

var text = $("#banner").contents().filter(function() { 
    if (this.nodeType == 3) { // Text Node 
    return this; 
    }   
})[0]; 

DEMO。

Answer 2

見http://jsfiddle.net/PhSBE/

只需使用

#banner{font-weight:bold} /* Title's rules */ 
#banner>#subtitle{font-weight:normal} /* Subtitle's rules */ 

編輯：

如果要提取文本，你可以看到https://stackoverflow.com/a/12135377/1529630

這是從一個元素中提取文本，忽略HTML元素的功能。

Answer 3

如果你改變h1大膽，你需要改變span正常，因爲子元素是從父母

inherting CSS如果你想使某些屬性This is the Title只需要再拍<span>它。