访问子节点childNodes

访问选定元素节点下的所有子节点的列表,返回的值可以看作是一个数组,他具有length属性。

语法:

elementNode.childNodes

注意:

如果选定的节点没有子节点,则该属性返回不包含节点的 NodeList。

我们来看看下面的代码:

运行结果:

IE:

  UL子节点个数:3
节点类型:1

其它浏览器:

   UL子节点个数:7
节点类型:3

注意:

1. IE全系列、firefox、chrome、opera、safari兼容问题

2. 节点之间的空白符,在firefox、chrome、opera、safari浏览器是文本节点,所以IE是3,其它浏览器是7,如下图所示:

如果把代码改成这样:

<ul><li>javascript</li><li>jQuery</li><li>PHP</li></ul>

运行结果:(IE和其它浏览器结果是一样的)

  UL子节点个数:3
节点类型:1

访问子节点childNodes的更多相关文章

  1. JavaScript--DOM访问子结点childNodes

    访问子结点childNodes 访问选定元素节点下的所有子节点的列表,返回的值可以看作是一个数组,他具有length属性. 语法: elementNode.childNodes 注意: 如果选定的节点 ...

  2. 使用JavaScript访问子节点方法elementNode.childNodes时,需要注意的地方

    有这样一个HTML结构 <div> javascript <p>javascript</p> <div>jQuery</div> <h ...

  3. DOM访问关系(父节点 子节点)

    把下面的知识点掌握了,可以做一下下面的案例,都是工作中常用的,很有用 知识点   1.带Eleent和不带区别     a)带Element的获取的是元素节点     b)不带Element的获取文本 ...

  4. js子节点children和childnodes的用法(非原创)

    想要获取子节点的数量,有几种办法. childNodes 它会把空的文本节点当成节点, <ul> 文本节点 <li>元素节点</li> 文本节点 <li> ...

  5. js子节点children和childnodes的用法

    想要获取子节点的数量,有几种办法. childNodes 它会把空的文本节点当成节点, <ul> 文本节点 <li>元素节点</li> 文本节点 <li> ...

  6. DOM的概念及子节点类型

    前言 DOM的作用是将网页转为一个javascript对象,从而可以使用javascript对网页进行各种操作(比如增删内容).浏览器会根据DOM模型,将HTML文档解析成一系列的节点,再由这些节点组 ...

  7. DOM的概念及子节点类型【转】

    前言 DOM的作用是将网页转为一个javascript对象,从而可以使用javascript对网页进行各种操作(比如增删内容).浏览器会根据DOM模型,将HTML文档解析成一系列的节点,再由这些节点组 ...

  8. DOM基础之“寻找”子节点

    今天学习了JS中的DOM的内容,虽然小菜的理解不深,但希望能够记录下来,慢慢一点一点的进步,有更深的理解了,再回来补充. 首先,关于DOM的概念: 1.概念:DOM = document(文档)Obj ...

  9. JS获取子节点、父节点和兄弟节点的方法实例总结

    转自:https://www.jb51.net/article/143286.htm 本文实例讲述了JS获取子节点.父节点和兄弟节点的方法.分享给大家供大家参考,具体如下: 一.js获取子节点的方式 ...

随机推荐

  1. zedboard--基于zedboard的demo系统的boa服务器搭建(二十一)

    zedboard提供的demo系统很迷你,但是也能移植嵌入式Web服务器的.这里就移植boa服务器. 1.下载Boa服务器源代码(安装好了交叉编译器) http://www.boa.org/,选择最后 ...

  2. LXD 2.0 系列(一):LXD 入门

    LXD是提供了RESTAPI的LXC 容器管理器,主要是管理linux容器的第三方管理器.也许现在您还没有听说过,下面我们就来入门——介绍一下LXD 什么是 LXD ? 简单地说,LXD 就是一个提供 ...

  3. c语言打印uint64, int64

    http://stackoverflow.com/questions/9225567/how-to-print-a-int64-t-type-in-c

  4. IOS-UITableView入门(3)

    UITableView本身自带了(增.删)编辑功能: 1.仅仅要调用UITableView的编辑代码 就会进入编辑状态: [self.tableView setEditing:!self.tableV ...

  5. VMware Workstation的网络连接方式:NAT、桥接和Host Only

    安装完VMware Workstation后会自动生成两个网络连接:VMware Network Adapter VMnet8 和 VMware Network Adapter VMnet1(通常称为 ...

  6. windows程序崩溃生成dump文件

    第一种: 通过任务管理器:这种适用在程序挂了(crash)的时候进程还未退出,比如我运行程序,出现了下面的错: 此时打开任务管理器,右击相应进程,点击"Create Dump File“: ...

  7. Mysql InnoDB锁

    MySQL 不同引擎的锁机制: MyISAM和MEMORY采用表级锁(table-level locking) BDB采用页面锁(page-leve locking)或表级锁,默认为页面锁 InnoD ...

  8. UI组件之TextView及其子类(五)计时器Chronometer

    Chronometer直接继承了TextView组件,它会显示一段文本,显示从某个事实上时间開始.一共过了多长时间.我们看Chronometer的源代码: watermark/2/text/aHR0c ...

  9. javascript 模块化模式总结(二)

    一.对象字面值 这种设计模式中,一个对象被描述为一组以逗号分隔的名称/值对括在大括号({})的集合.对象内部的名称可以是字符串或是标记符后跟着一个冒号":".在对象里最后一个名称/ ...

  10. WCF深入浅出学习1

    1.本文主要对WCF的基本使用做简单化介绍,对于初学WCF的来说,初期对于配置文件的理解,比较烦躁吧,相信你看完了该文,能够达到深入浅出的感觉. 关于WCF的概念 和 应用场景,在此处不做详细介绍,可 ...