JQuery:获取不包含嵌套标签的标签内容。

时间:2022-06-24 20:22:06

I've got some HTML like the following:

我有一些HTML,如下所示:

<span id="A">Text I'm interested in
  <span id="B">Other crap I don't care about</span>
</span>

I'm looking to get the text content of span "A" excluding any nested tags (i.e. the content of span "B" in the above example). I'm trying to get the text content, not the HTML content. Also, in my particular case, I know there will always be some text inside of span A prior to any other tags, but I'm interested in the less-constrained solution as well.

我希望得到span“A”的文本内容,不包括任何嵌套标签(即上面示例中span“B”的内容)。我在尝试获取文本内容,而不是HTML内容。另外,在我的例子中,我知道在span A中总是会有一些文本先于其他标签,但我也对约束更少的解决方案感兴趣。

The simple-but-clunky approach I've considered going with is just doing $("#A").html() and then parsing through until I hit an unescaped "<" but it feels like there should be a cleaner solution.

我考虑过的简单但笨拙的方法是执行$(“#A”).html(),然后解析,直到我遇到一个未转义的“<”,但是感觉应该有一个更干净的解决方案。

3 个解决方案

#1


6  

I'm fairly sure there's no built in way to do it - although you could look for a plugin, it may exist. Someone else posted the .text() method (but deleted the post) which will get you ALL the text, minus the tags, which means you'll get "Text I'm interested in Other crap I don't care about" -- not what you want.

我很确定没有内置的方法来实现它——尽管你可以寻找一个插件,它可能是存在的。其他人发布了.text()方法(但删除了post),它会给你所有的文本,减去标签,这意味着你将得到“我对其他我不关心的垃圾感兴趣”——而不是你想要的。

EDIT

编辑

Okay, I decided I was interested in this so I spent some time. Here's the solution :)

好吧,我决定我对这个感兴趣所以我花了一些时间。解决方案:)

    copyOf = $('#A').clone();
    copysKids = copyOf.children();
    copysKids.remove();

    alert(copyOf.text());

What we're doing is making a clone of the node you're trying to get text out of - we don't want to operate on the original because this would change the page. Then we're grabbing a collection of all the child nodes, and nuking them. The remaining text is the text you were looking for.

我们正在做的是复制一个节点,你想要从中得到文本——我们不想在原始文件上操作,因为这会改变页面。然后我们获取所有子节点的集合,并对它们进行nuking。剩下的文本是您要查找的文本。

#2


0  

The following should get it for you

下面的内容应该会对你有所帮助

$("#A").find("#B").remove().end().text());

This is very specific to your problem. Not sure if there's a generic solution, though

这是针对你的问题的。但不确定是否有通用的解决方案

#3


0  

For the OP's specific example, the correct solution would be

对于OP的特定示例,正确的解决方案是

$('#A').prop('firstChild').nodeValue

This would have to be elaborated a bit if you wanted a robust solution that would handle a situation where one or more of the first N children were tags instead of text nodes.

如果您想要一个健壮的解决方案来处理前N个子节点中有一个或多个是标记而不是文本节点的情况,那么这一点就需要详细说明。

#1


6  

I'm fairly sure there's no built in way to do it - although you could look for a plugin, it may exist. Someone else posted the .text() method (but deleted the post) which will get you ALL the text, minus the tags, which means you'll get "Text I'm interested in Other crap I don't care about" -- not what you want.

我很确定没有内置的方法来实现它——尽管你可以寻找一个插件,它可能是存在的。其他人发布了.text()方法(但删除了post),它会给你所有的文本,减去标签,这意味着你将得到“我对其他我不关心的垃圾感兴趣”——而不是你想要的。

EDIT

编辑

Okay, I decided I was interested in this so I spent some time. Here's the solution :)

好吧,我决定我对这个感兴趣所以我花了一些时间。解决方案:)

    copyOf = $('#A').clone();
    copysKids = copyOf.children();
    copysKids.remove();

    alert(copyOf.text());

What we're doing is making a clone of the node you're trying to get text out of - we don't want to operate on the original because this would change the page. Then we're grabbing a collection of all the child nodes, and nuking them. The remaining text is the text you were looking for.

我们正在做的是复制一个节点,你想要从中得到文本——我们不想在原始文件上操作,因为这会改变页面。然后我们获取所有子节点的集合,并对它们进行nuking。剩下的文本是您要查找的文本。

#2


0  

The following should get it for you

下面的内容应该会对你有所帮助

$("#A").find("#B").remove().end().text());

This is very specific to your problem. Not sure if there's a generic solution, though

这是针对你的问题的。但不确定是否有通用的解决方案

#3


0  

For the OP's specific example, the correct solution would be

对于OP的特定示例,正确的解决方案是

$('#A').prop('firstChild').nodeValue

This would have to be elaborated a bit if you wanted a robust solution that would handle a situation where one or more of the first N children were tags instead of text nodes.

如果您想要一个健壮的解决方案来处理前N个子节点中有一个或多个是标记而不是文本节点的情况,那么这一点就需要详细说明。