如何获取第一个 HTML 元素的文本
Posted
技术标签:
【中文标题】如何获取第一个 HTML 元素的文本【英文标题】：How to get text of first HTML element 【发布时间】：2019-11-17 09:40:57 【问题描述】：如何遍历 html DOM 以递归方式获取每个元素的文本。我只需要获取 HTML 元素的文本而不需要子元素的文本。 考虑是否存在嵌套的 HTML 元素，那么如何获取第一个元素的文本，消除嵌套的子元素和相应的文本。
我试过“elem.InnerHTML”、“elem.InnerTEXT”、“elem.TextContent”，但这些似乎都回来了来自所有嵌套元素的文本。
代码示例： 我的 HTML 如下：
<HTML>
<HEAD></HEAD>
<BODY>
<DIV> SOMEDIVTEXT
<TABLE>
<TBODY>
<TR><TD>COLUMN1</TD></TR>
<TR><TD>COLUMN2</TD></TR>
</TBODY>
</TABLE>
</DIV>
</BODY>
</HTML>
我只需要在当前节点指针位于 DIV 时提取 SOMEDIVTEXT 而不获取嵌套子级的文本。
【问题讨论】：
提供minimal reproducible example，以便我们了解您的操作/方法以及出了什么问题 离题，但为什么你的tbody 元素在你的table 元素之外？
您尝试获取的文本存储在 DOM 中，是 div 内元素的一个单独节点，因此单独提取它应该不难。到目前为止，您尝试过什么？
@Spudley 这个 HTML 是在客户端生成的，不受我们控制。我们现在可以忽略 TBody，因为它并不总是这样。
所以，我的基本需求是遍历完整的 HTML DOM。我通过 TreeWalker 方法执行此操作，如下所示： var treeWalker = document.createTreeWalker( document.body, NodeFilter.SHOW_ELEMENT );
【参考方案1】：
试试firstChild 属性。它获取文本节点。
例如：
document.body.firstElementChild.firstChild
适用于此代码示例。
【讨论】：
感谢您的指导。我试过了，但我需要遍历 HTML DOM 并获取所有元素的内部文本。通过您的代码，我将获得 TBODY 对象而不是 DIV。我的问题是，如果我的当前节点是 DIV，我想提取 DIV 内文（SOMEDIVTEXT）而不获取子内文。【参考方案2】：好的，假设 (1) 您正在浏览器中编写 javascript，并且 (2) 您将元素作为对象（您在问题中提到了“elem”，所以我猜您有？），那么您可以使用elem.childNodes() 获取元素的子元素。
这将为您提供一个包含元素内每个节点的Nodelist 对象。对于您在问题中引用的 HTML，这将是两个节点；第一个是包含文本SOMEDIVTEXT 的文本节点，第二个是包含<TABLE> 元素的元素节点。
所以elem.childNodes[0] 会得到你试图提取的文本。
但是 DOM 非常灵活，因此还有其他属性和方法也可以获得相同的效果，包括另一个答案中提到的 'elem.firstChild'。
【讨论】：
以上是关于如何获取第一个 HTML 元素的文本的主要内容，如果未能解决你的问题，请参考以下文章