Node节点对象

最新推荐文章于 2023-06-09 11:01:22 发布

原创最新推荐文章于 2023-06-09 11:01:22 发布 · 632 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#nodeName #dom

前端同时被 2 个专栏收录

19 篇文章

订阅专栏

15 篇文章

订阅专栏

本文深入探讨了DOM中的Node节点对象，重点关注nodeName属性用于获取节点名称，nodeType揭示节点类型，以及nodeValue如何表示节点的值。通过对这三个关键属性的理解，开发者能更好地操作和遍历DOM树。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

nodeName 节点名称
nodeType 节点类型
nodeValue 节点的值

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>test</title>
</head>
<body>
    <input type="text" id="nameId" value="zhangsan" />
    <span id="spanId">我是span区域</span>
</body>
<script type="text/javascript">
/*
            元素          属性          文本
nodeName    大写的标签名  属性名称        #text
nodeType    固定的1        固定的2        固定的3
nodeValue   null        属性的值        内容

parentNode  获取父节点
childNodes  所有子节点
firstChild  第一个子节点
lastChild   最后一个子节点
*/
    var input = document.getElementById("nameId");
        alert(input.nodeName); //INPUT
        alert(input.nodeType); //1
        alert(input.nodeValue); //null
    var attr = input.getAttributeNode("type");
        alert(attr.nodeName); //type
        alert(attr.nodeType); //2
        alert(attr.nodeValue); //text
    var span = document.getElementById("spanId");
    var text = span.firstChild;
        alert(text.nodeName); //#text
        alert(text.nodeType); //3
        alert(text.nodeValue); //我是span区域

</script>
</html>