如何获取没有元素子元素的元素内文本的css句柄

【问题标题】：How to get css handle for text inside element without elements child如何获取没有元素子元素的元素内文本的css句柄
【发布时间】：2016-07-02 01:37:57
【问题描述】：

如果我们使用tbody tr th，它会给出文本“显示模型示例标题”，包括其子元素 (div) 文本。是否有任何可能的技巧来仅获取“显示模型”而不是其子元素“示例标题”文本？

<table>
 <tbody>
   <tr>
     <th>
      Display model
      <div class="title">Sample Heading</div>
     </th>
    <td class="model">Data</td>
   </tr>
 </tbody>
</table>

【问题讨论】：

如果您还有其他期待，请告诉我
它有效，但我尝试了 $("tbody tr th").contents().not($("tbody tr th").children()).text()
请在下面的答案中查看我的演示
是的，它正在工作，感谢您的帮助

标签： java jquery html coffeescript

【解决方案1】：

工作演示 jQuery 方式

$(document).ready(function(){
    $('th').css('color','red').children().css('color','initial')

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
 <tbody>
   <tr>
     <th>
      Display model
      <div class="title">Sample Heading</div>
     </th>
    <td class="model">Data</td>
   </tr>
 </tbody>
</table>

工作演示 CSS 方式

th{
  color:red;
}
th div{
  color:initial;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
 <tbody>
   <tr>
     <th>
      Display model
      <div class="title">Sample Heading</div>
     </th>
    <td class="model">Data</td>
   </tr>
 </tbody>
</table>

【讨论】：