如何在td中没有div的情况下获取td的文本

Question

html 看起来像这样：

<td class="desc-col">
    Good Stuff
    <div class="options">
        <ul>            
            <li>
                <em>Price</em>
                    $800.00
            </li>                                                                   
        </ul>
    </div>
</td>
<td class="desc-col">
    Awesome Stuff
    <div class="options">
        <ul>            
            <li>
                <em>Price</em>
                    $200.00
            </li>                                                               
        </ul>
    </div>
</td>

我想在 td 中获取文本但不想要任何其他内容。我试过这个，但它不仅仅得到 td：

Array = [];
$("td.desc-col").each(function() {
  Array.push( $(this).text());});

我怎么会简单地得到这个：

["Good Stuff","Awesome Stuff"]

Answer 1

使用contents()获取所有子元素（包括原始 DOM 文本节点），然后选择第一个：

JSFiddle：http : //jsfiddle.net/TrueBlueAussie/3s6n4d5y/5/

var Array = [];
$("td.desc-col").each(function () {
    Array.push($(this).contents().first().text());
});
alert(Array[0]);   // "Good stuff"
alert(Array[1]);   // "Awesome Stuff"

如果您需要修剪文本，请使用jQuery.trim()或$.trim()as"string".trim并非所有浏览器都支持。

正如A. Wolff建议的那样，您可以使用map()和简化此操作get()：

http://jsfiddle.net/3s6n4d5y/6/

var Array = $("td.desc-col").map(function () {
    return $.trim($(this).contents().first().text());
}).get();
console.log(Array);

更新：如果内容可能不是第一个元素，您可以filter()按节点类型：

JSFiddle：http : //jsfiddle.net/TrueBlueAussie/3s6n4d5y/8/

var Array = $("td.desc-col").map(function () {
    return $.trim($(this).contents().filter(function() {
        return this.nodeType === 3;     // Node.TEXT_NODE
      }).first().text());
}).get();
console.log(Array);