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()，因为所有浏览器都不支持"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);

Answer 2

一种方式：

Array = [];
$("td.desc-col").each(function () {
    Array.push($(this).contents()[0].nodeValue.trim());
});
console.log(Array)

<强> jsFiddle example

迭代单元格，获取每个单元格的内容，获取第一个节点（修剪内容）并将其附加到数组中。

Answer 3

或试试这个......

var text = $('.desc-col').clone().find('.options').remove().end().text();

希望有所帮助：）

OOPS，错过了阵列部分。这是一个数组：

var textArray = $('.desc-col').clone().append('**').find('.options').remove().end().text().trim().split('**');

-Ted

Answer 4

以下是一段代码，用于检测<td>中任何位置的文本

$("td.desc-col").contents().each(function(index, elem) {
  if ($.trim(elem.nodeValue) != '' && elem.nodeType == 3)
    alert($.trim(elem.nodeValue))
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td class="desc-col">
      <span>some text</span>
      Good Stuff
      <div class="options">
        <ul>
          <li>
            <em>Price</em>
            $800.00
          </li>
        </ul>
      </div>
some other good stuff
</td>
  </tr>
</table>

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

4 个答案: