常用的节点有元素节点、属性节点、文本节点、注释节点、文档节点

来看例子：

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

         "http://www.w3.org/TR/html4/loose.dtd">

 <html>

 <head>

     <meta charset="UTF-8">

     <title>节点</title>

     <script type="text/javascript" src="../js/jquery-1.8.2.js"></script>

     <script type="text/javascript">

       $(function(){

         //元素节点

         var li = $('li').first()[0];//document.getElementById('firstLi')

         console.info(li.nodeType);

         console.info(li.nodeName);

         console.info(li.nodeValue);

        //属性节点

        var idAttr = li.getAttributeNode('id');//li.attributes[0]

        console.info(idAttr.nodeType);

        console.info(idAttr.nodeName);

        console.info(idAttr.nodeValue) 

        //文本节点

        var textNode = li.firstChild;//li.childNodes[0]

        console.info(textNode.nodeType);

        console.info(textNode.nodeName);

        console.info(textNode.nodeValue);  

        /**

        childNodes:既有文本节点、也有元素节点

        children  :没有文本节点、但有元素节点

        */

        //注释节点

        var comment = document.getElementsByTagName('body')[0].firstChild

        console.info(comment.nodeType);

        console.info(comment.nodeName);

        console.info(comment.nodeValue);

        //文档节点

        console.info(document.nodeType);

        console.info(document.nodeName);

        console.info(document.nodeValue);              

       });

 /*

 5种节点：

 {

             元素节点   属性节点     文本节点            注释节点    文档节点

 nodeType：  1          2           3                  8          9

 nodeName：  标签名     属性名称     #text              #comment   #document

 nodeValue： null       属性value   标签中间夹的文本值   注释内容    null

 }

 */

     </script>

 </head>

 <body><!--测试注释~~~-->

   <ul>

    <li id='firstLi'>文本1<span>测试span</span></li>

    <li>2</li>

    <li>3</li>

    <li>4</li>

   </ul>

 </body>

 </html>

html中节点类型的更多相关文章

  1. javascript之DOM（一节点类型Node）

    DOM(Document Object Model)是针对HTML和XML文档的一个API.DOM描述的是一个层次化的节点树,允许开发人员添加.移除和修改页面的某一部分.起源于DHML,现为W3C的推 ...

  2. [原创]java WEB学习笔记81：Hibernate学习之路--- 对象关系映射文件(.hbm.xml)：hibernate-mapping 节点，class节点，id节点(主键生成策略)，property节点，在hibernate 中 java类型 与sql类型之间的对应关系，Java 时间和日期类型的映射，Java 大对象类型 的 映射 (了解),映射组成关系

    本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱 ...

  3. xpath的数据和节点类型以及XPath中节点匹配的基本方法

    XPath数据类型  XPath可分为四种数据类型:  节点集(node-set)  节点集是通过路径匹配返回的符合条件的一组节点的集合.其它类型的数据不能转换为节点集.  布尔值(boolean)  ...

  4. javascript DOM中的节点层次和节点类型概述

    针对JS高级程序设计这本书,主要是理解概念,大部分要点源自书内.写这个主要是当个笔记加总结 存在的问题请大家多多指正! 因为DOM这方面的对象方法操作性都特别强,但是逻辑很简单,所以就没有涉及到实际的 ...

  5. Fabric中的节点类型

    在Fabric中,尽管所有对等节点/peer都是相同的,但它们可以根据网络的配置方式承担多个角色:(①②是主要的节点类型) ①提交节点: 通道中的每个对等节点都是一个提交节点.它们接收生成的交易区块, ...

  6. 深入理解DOM节点类型第五篇——元素节点Element

    × 目录 [1]特征 [2]子节点 [3]特性操作[4]attributes 前面的话 元素节点Element非常常用,是DOM文档树的主要节点:元素节点是html标签元素的DOM化结果.元素节点主要 ...

  7. 深入理解DOM节点类型第二篇——文本节点Text

    × 目录 [1]特征 [2]空白 [3]属性[4]方法[5]性能 前面的话 文本节点顾名思义指向文本的节点,网页上看到的文字内容都属于文本节点.该节点简单直观,本文将详细介绍该部分内容 特征 文本节点 ...

  8. 深入理解DOM节点类型第六篇——特性节点Attribute

    × 目录 [1]特征 [2]属性 [3]方法 前面的话 元素的特性在DOM中以Attr类型表示,从技术角度讲,特性是存在于元素的attributes属性中的节点.尽管特性是节点,但却不是DOM节点树的 ...

  9. 深入理解DOM节点类型第七篇——文档节点DOCUMENT

    × 目录 [1]特征 [2]快捷访问 [3]文档写入 前面的话 文档节点document,隶属于表示浏览器的window对象,它表示网页页面,又被称为根节点.本文将详细介绍文档节点document的内 ...

随机推荐

  1. VBS列出windows更新列表

    Set objSession = CreateObject("Microsoft.Update.Session") Set objSearcher = objSession.Cre ...

  2. R语言读取EXCEL文件的各种方法

    路径问题 原始文件路径C:\Users\air\Desktop\1.txt R中有两种方法读取该路径 C:\\Users\\air\\Desktop\\1.txt C:/Users/air/Deskt ...

  3. 【RL-TCPnet网络教程】第29章 NTP网络时间协议基础知识

    第29章      NTP网络时间协议基础知识 本章节为大家讲解NTP (Network Time Protocol,网络时间协议)和SNTP(简单网络时间协议,Simple Network Time ...

  4. Redis两种方式实现限流

    案例-实现访问频率限制: 实现访问者 $ip 在一定的时间 $time 内只能访问 $limit 次. 非脚本实现 private boolean accessLimit(String ip, int ...

  5. JAVA四类八种基本数据类型

    boolean类型 Boolean在内存中占用一个字节. 当java编译器把java源代码编译为字节码时,会用int或byte来表示boolean.在java虚拟机中,用整数零来表示false,用任意 ...

  6. [Swift]LeetCode873. 最长的斐波那契子序列的长度 | Length of Longest Fibonacci Subsequence

    A sequence X_1, X_2, ..., X_n is fibonacci-like if: n >= 3 X_i + X_{i+1} = X_{i+2} for all i + 2 ...

  7. server.properties 文件详解

    [转载]:server.properties 文件详解 # 每一个Broker在集群中的唯标识.即使Broker的IP地址发生了变化,broker.id只要没变,则不会影响consumers的消息情况 ...

  8. 一张脑图说清 Nginx 的主流程

    一张脑图说清 Nginx 的主流程 这个脑图在 nginx-1.14.0-research 上.这是我在研究nginx的http模块的时候画的.基本上把 Nginx 主流程(特别是 HTTP 的部分) ...

  9. Bootstrap 字体与图标

    常用网站:icons/Font awesome/bookstrap 控制图标的大小使用 fa-lg (33%递增).fa-2x. fa-3x.fa-4x,或者 fa-5x 类 来放大图标.旋转动画 & ...

  10. Redis哨兵

    Redis Sentinel Redis哨兵为Redis提供高可用.这就意味着你用哨兵可以创建一个Redis部署,在没有人为干预的情况下抵抗某些失败.(PS:自动故障转移) Redis哨兵还提供其他的 ...