什么是 nodeName 属性
nodeName 属性是 DOM 元素节点的一个只读属性，用于返回节点的名称。在 HTML 文档中，节点的名称通常就是标签名，比如 <div> 元素的 nodeName 就是 "DIV"，而 <p> 元素的 nodeName 就是 "P"。
如何使用 nodeName 属性
要访问节点的 nodeName 属性，首先需要获取到对应的 DOM 元素节点。可以通过 document.getElementById、document.querySelector 等方法来获取节点，然后直接访问其 nodeName 属性即可。
-- -------------------- ---- -------
--------- -----
------
------
--------------- ----------
-------
------
---- --------------- --- --------
--------
--- ------- - ---------------------------------
------------------------------ -- -- ---
---------
-------
-------在上面的示例中，我们通过 document.getElementById 方法获取了 id 为 "myDiv" 的 div 元素节点，并输出了其 nodeName 属性的值。
nodeName 和 tagName 的区别
在实际开发中，有时候会混淆 nodeName 和 tagName 这两个属性。它们的区别在于，nodeName 返回的是节点的名称（大写），而 tagName 返回的是节点的标签名（小写）。
-- -------------------- ---- -------
--------- -----
------
------
--------------- - ------- -----------
-------
------
---- --------------- --- --------
--------
--- ------- - ---------------------------------
------------------------------ -- -- ---
----------------------------- -- -- ---
---------
-------
-------在上面的示例中，我们分别输出了 nodeName 和 tagName 的值，可以看到它们的区别。
nodeName 属性的应用场景
nodeName 属性在实际开发中有很多应用场景，比如可以用来判断节点的类型，从而进行相应的操作。
-- -------------------- ---- -------
--------- -----
------
------
--------------- ------------
-------
------
---- --------------- --- --------
--------
--- ------- - ---------------------------------
-- ----------------- --- ------ -
------------------- - ------
-
---------
-------
-------在上面的示例中，我们根据 nodeName 属性的值来判断节点是否为 div 元素，如果是，则改变其文本颜色为红色。
总结
通过本文的介绍，我希望你能够更加了解 HTML DOM 中的 nodeName 属性，以及它的基本用法和应用场景。在实际开发中，灵活运用 nodeName 属性可以帮助我们更好地操作和管理 DOM 元素节点。祝你在前端开发的道路上越走越远！