美文网首页
关于 nodeType 、nodeName 、nodeValue

关于 nodeType 、nodeName 、nodeValue

作者: 风起云帆 | 来源:发表于2019-02-17 13:23 被阅读0次

    nodeType 属性:

    每个节点都有一个 nodeType 属性,用于表明节点的类型,节点类型由 Node 类型中定义12个常量表示。

    常量名 常量值 节点类型 描述
    Node.ELEMENT_NODE 1 Element 代表元素
    Node.ATTRIBUTE_NODE 2 Att 代表属性
    Node.TEXT_NODE 3 Text 代表元素或属性中的文本内容
    Node.CDATA_SECTION_NODE 4 CDATASection 代表文档中的 CDATA 部(不会由解析器解析的文本)
    Node.ENTITY_REFERENCE_NODE 5 EntityReference 代表实体引用
    Node.ENTITY_NODE 6 Entity 代表实体
    Node.PROCESSING_INSTRUCTION_NODE 7 ProcessingInstruction 代表处理指令
    Node.COMMENT_NODE 8 Comment 代表注释
    Node.DOCUMENT_NODE 9 Document 代表整个文档(DOM 树的根节点)
    Node.DOCUMENT_TYPE_NODE 10 DocumentType 向为文档定义的实体提供接口
    Node.DOCUMENT_FRAGMENT_NODE 11 DocumentFragment 代表轻量级的 Document 对象(文档的某个部分)
    Node.NOTATION_NODE 12 Notation 代表 DTD 中声明的符号

    示例:

    <body>
    <div id="wrapper">hello world</div>
    
    <script type="text/javascript">
    
        var wrapper = document.getElementById("wrapper");
        var node = document.getElementById("wrapper").getAttributeNode("id");
        var text = document.getElementById("wrapper").firstChild;
    
        console.log(wrapper.nodeType);     //1
        console.log(node.nodeType);        //2
        console.log(text.nodeType);        //3
    </script>
    </body>
    

    nodeName 属性 与 nodeValue 属性:

    可以使用 nodeNamenodeValue 这两个属性。这两个属性的值完全取决于节点的类型。

    一般来说:

    • 元素节点的 nodeName 是标签名称
    • 属性节点的 nodeName 是属性名称(大写)
    • 文本节点的 nodeName 永远是 #text
    • 文档节点的 nodeName 永远是 #document

    继续上面的例子,打印出来:

    1. console.log(document.nodeName)    //#document
    2. console.log(wrapper.nodeName);    //DIV
    3. console.log(node.nodeName);       //id
    4. console.log(text.nodeName);       //#text
    
    • 对于文本节点,nodeValue 属性包含文本。
    • 对于属性节点,nodeValue 属性包含属性值。
    • 文档节点和元素节点,nodeValue 属性的值始终为 null
        console.log(document.nodeValue)    //null
        console.log(wrapper.nodeValue);    //null
        console.log(node.nodeValue);       //wrapper
        console.log(text.nodeValue);       //hello world
    

    相关文章

      网友评论

          本文标题:关于 nodeType 、nodeName 、nodeValue

          本文链接:https://www.haomeiwen.com/subject/ulbieqtx.html