在前端开发中，我们经常会使用getElementsByTagName()方法来获取文档中指定标签名的所有元素，然而你可能不知道它还有一个等效的方法document.getElementsByTagName("*")，它可以获取所有的文本节点。这些文本节点包含了HTML标记中的所有文本和注释。
textNodes是什么？
在DOM树中，文本节点是元素节点的一个子节点，它存储着文本字符串。例如，在以下HTML代码中：
----- -------- ---------- ------
<p>元素节点将会有一个子节点——文本节点，其中包含了“Hello World!”这个字符串。
使用textNodes
从整个文档中获取所有的文本节点非常容易，只需使用document.getElementsByTagName("*")方法，并遍历返回的NodeList即可。如下所示：
----- ------------ - -----------------------------------
--- ---- - - -- - - -------------------- ---- -
----- ----------- - ----------------
-- --------------------- --- --------------- -
-------------------------------------
-
-在上面的代码中，我们首先使用getElementsByTagName("*")获取了所有的元素节点和文本节点，然后通过遍历NodeList，筛选出所有文本节点并打印出它们的内容。
另外，如果你只需要获取特定元素节点下的文本节点，可以使用element.getElementsByTagName("*")方法，其中element是一个元素节点。例如，以下代码将会获取<div>元素节点下的所有文本节点：
----- ---------- - ------------------------------
----- --------- - -------------------------------------
--- ---- - - -- - - ----------------- ---- -
----- ----------- - -------------
-- --------------------- --- --------------- -
-------------------------------------
-
-指导意义
了解getElementsByTagName("*")等效为textNodes这个特性有助于我们更好地理解DOM树结构和节点类型，同时也能够提高我们的代码效率。在实际开发中，如果需要对文本节点进行操作或者统计页面中文本内容的数量，就可以使用上述方法。
总之，深入了解JavaScript和DOM API是成为优秀前端工程师必须要掌握的技能之一。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/12846