Question

我的部分内容是：

<tr id="row">
  <td abbr='selectme'>
    <div>Texti inside the div</div>
    Text outside the div
  </td>

  <td>
    any others I dont care about
  <td>
</tr>

我正在尝试选择“div之外的文字”，它位于具有'selectme'属性的td中。我怎样才能用jquery来实现呢？

我试过这样：

$("#row").find("[abbr='selectme']").text()

但它什么也没有返回。

Answer 1

.text()也会返回后代元素的文本内容，将其过滤掉

var text = $("#row").find("[abbr='selectme']").contents().filter(function () {
    //select only text nodes of the targetted td element
    return this.nodeType == 3
}).text();

演示：Fiddle

Answer 2

你得到任何回报的原因可能是因为你必须把它包装在

中

$( document ).ready(function() {}); or $(function(){});

因为在通过jquery到达之前需要在DOM中加载div，否则你正在访问尚未加载的元素。所以使用这段代码：

$(function () {
        alert($("#row").find("[abbr='selectme']").text());
});

您将收到以下文字： div内的Texti div之外的文字

现在你想只得到文本“div之外的文本”，这是纯文本而不包含在任何标记中你必须使用.contetns（）。filter（）函数并获取

nodeType === 3

数值“3”用于获取文本节点。所以你最终的代码看起来像这样（我使用警报说明）

 // Shorthand for $( document ).ready()
    $(function () {
        // getting the specific text and saving into a variable
        //getting the contents of the target element
        var myText = $("#row").find("[abbr='selectme']").contents()
        // using the filter to get the text node
            .filter(function () {
                return this.nodeType === 3;
            //getting the final text
            }).text();
        alert(myText);
    });

现在，当您运行程序时，您将获得输出“div之外的文本”。

以下是工作示例http://jsfiddle.net/842nn/

Answer 3

您可以简单地通过attr名称搜索元素：

$("[abbr='selectme']").text();

如何使用jquery选择具有'abbr'属性特定值的元素

3 个答案: