在 Web 开发中，使用 JavaScript 可以很方便地获取网页的各种元素，其中包括 HTML 标记。本文将介绍如何使用 JavaScript 获取 HTML 标记，并附上相关示例代码。
1. 使用 document.getElementsByTagName()
document.getElementsByTagName() 方法可以返回指定标签名的所有 HTML 元素。例如，要获取所有 <div> 标签，可以使用以下语句：
--- ---- - -------------------------------------
这将返回一个类数组对象，其中包含文档中的所有 <div> 元素。
2. 使用 document.getElementById()
如果知道要获取的 HTML 元素的 ID，可以使用 document.getElementById() 方法来获取该元素。例如，要获取具有 ID “myElement”的元素，可以使用以下语句：
--- --------- - -------------------------------------
这将返回具有 ID “myElement” 的 HTML 元素。
3. 使用 document.querySelector()
document.querySelector() 方法可返回文档中与指定 CSS 选择器匹配的第一个元素。例如，要获取第一个 <p> 元素，可以使用以下语句：
--- --------- - ----------------------------
这将返回文档中第一个 <p> 元素。
4. 使用 document.querySelectorAll()
document.querySelectorAll() 方法与 document.querySelector() 类似，不同之处在于它会返回匹配的所有元素，而不只是第一个元素。例如，要获取所有 class 为 “myClass”的元素，可以使用以下语句：
--- ---------- - --------------------------------------
这将返回文档中所有 class 为 “myClass” 的 HTML 元素。
深度和学习
理解如何获取 HTML 标记是成为优秀前端工程师的重要基础。在实际开发中，经常需要使用 JavaScript 来操作页面上的各种元素，比如对元素进行样式修改、添加事件监听器等操作，这些操作都离不开正确地获取 HTML 标记。
因此，在学习 JavaScript 或者其他前端技术时，务必要对 HTML 标记有深入的理解，并熟练掌握相应的 DOM API。
指导意义
本文介绍了四种常见的方法来获取 HTML 标记。在实际开发中可以根据自己的需求选择合适的方法。同时，理解这些方法的实现原理也有助于提升对 JavaScript 和 DOM 的理解。
下面是一个完整的示例代码，展示了如何使用 document.querySelectorAll() 方法获取并修改 HTML 元素的样式：
--------- -----
------
------
-------------------
-------
- -
------ ----
-
--------
-------
------
-------- ----------
-------- ----------
--------
--- ----- - -------------------------------
--- ---- - - -- - - ------------- ---- -
------------------------- - -------
-
---------
-------
-------在这个示例中，我们使用 document.querySelectorAll() 方法获取了所有 <p> 元素，并为它们添加了粗体样式。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/11963