DOM1定义了一个node接口，该接口由DOM的所有节点类型实现。

所有的节点都存在这样或那样的关系。在HTML中，head，body可以看出是html的子元素，html是head，body的父元素，而head，body互为同胞元素。

这里要注意一个概念：nodeList

输出：

如下例子：

 <div id="myDiv"> </div><!-- 此处有空格 -->

  <script>

     var div = document.getElementById('myDiv');

     var test = div.firstChild;

     if (test.nextSibling === null) {

         alert('good');//输出good

     }

     if (test.previousSibling === null) {

         alert('bad');//输出bad

     }

操作节点

加入到文档中

     <style>

         #test {font-size: 20px;background: red;height: 100px;}

         #myDiv {color:red;}

     </style>

 </head>

 <body>

   <ul id="test">

       <li>1</li><li>2</li><li>3</li>

   </ul>

  <script>

    var oul = document.getElementById('test');

    var deep = oul.cloneNode(true);

    alert(deep.childNodes.length);//7

    oul.parentNode.insertBefore(deep,oul);

    var shallow = oul.cloneNode(false);

    alert(shallow.childNodes.length);//0

    oul.parentNode.insertBefore(shallow,deep);

  </script>

输出：

第十章—DOM(0)—NODE类型的更多相关文章

  1. 第十章—DOM(一)——Document类型

    DOCUMENT类型 JS通过document类型表示文档,在文档中document对象是HTMLDocument的一个实例,表示整个HTML页面.document对象是window对象的一个属性,因 ...

  2. js DOM Node类型

    DOM(文档对象模型)是针对HTML和XML文档的一个API. DOM可以将任何HTML或XML文档描绘成一个由多层节点构成的.以特定节点为根节点的树形结构.节点分为12种不同的类型,每种类型分别表示 ...

  3. 从原型链看DOM－－Node类型

    前言: 本系列从原型,原型链,属性类型等方面下手学习了DOM文档对象模型,旨在弄清我们在DOM中常用的每一个属性和方法都清楚它从哪里来要到哪里做什么事,这样对于理解代码有一定启发.全靠自己在总结中摸索 ...

  4. DOM(一)：节点层次－Node类型

    Node类型DOM1级定义了一个Node接口,该接口将由DOM中的所有节点类型实现,每个节点都有一个nodeType属性,用于表明节点的类型.节点类型由在Node类型中定义的下列12个数值常量来表示, ...

  5. Node类型知识大全

    Node类型 1.节点关系 每个节点都有一个childNodes属性,其中保存着一个NodeList对象.NodeList是一种类数组对象,用于保存一组有序的节点,可以通过位置来访问这些节点.请注意, ...

  6. DOM 节点node

    DOM可以将任何HTML或XML文档描绘成一个有多层节点构成的结构,即在HTML中所有内容都是节点.文档节点是每个文档的根节点,文档节点有一个子节点,称为文档元素.每个文档只能有一个文档元素.在HTM ...

  7. JavaScript高级程序设计学习笔记第十章--DOM

    1.DOM:文档对象模型,是针对 HTML 和 XML 文档的一个 API(应用程序编程接口). 2.DOM 可以将任何 HTML 或 XML 文档描绘成一个由多层节点构成的结构. 3.文档节点是每个 ...

  8. 读书笔记 - js高级程序设计 - 第十章 DOM

      文档元素 是文档的最外层元素,在Html页面中,文档元素始终都是<html>元素 在xml中,任何元素都可以是文档元素 Node类型 Node.ELEMENT_NODE 元素 Node ...

  9. 第十章 DOM

    10.1节点层次 html元素通过元素节点表示,特性节点通过特性节点表示,文档类型节点通过文档类型节点访问,这些类型都继承一个基类型. 10.1.1 Node类型 JavaScript中的所有节点类型 ...

随机推荐

  1. 并查集 （poj 1611 The Suspects）

    原题链接:http://poj.org/problem?id=1611 简单记录下并查集的模板 #include <cstdio> #include <iostream> #i ...

  2. Django之模板语言(二)-----Filter

    1.其他常用的模板语言: 通过模板语言可以让前端页面显示数据,数据可以是基本数据类型,也可以是对象亦或者对象的列表,结合着模板中的for.if等配合使用. 要注意前端页面中,出现没有后端数据的情况,随 ...

  3. @RestControllerAdvice作用及原理

    原文:Spring Boot 系列(八)@ControllerAdvice 拦截异常并统一处理 在spring 3.2中,新增了@ControllerAdvice 注解,可以用于定义@Exceptio ...

  4. 嘴巴题6 BZOJ3450JoyOI1952 Easy

    Time Limit: 10 Sec Memory Limit: 128 MB Submit: 936 Solved: 698 [Submit][Status][Discuss] Descriptio ...

  5. leetcode 1071 Greatest Common Divisor of Strings

    lc1071 Greatest Common Divisor of Strings 找两个字符串的最长公共子串 假设:str1.length > str2.length 因为是公共子串,所以st ...

  6. Ionic JPush极光推送二

    1.看图解决问题   2.解决出现统计代码提示问题 修改这个java 文件 导入命名空间 import cn.jpush.android.api.JPushInterface; 添加方法 @Overr ...

  7. git add命令后出现Another git process seems to be running in this repositor...错误提示

    问题原因 在控制台使用git命令操作时,使用了 git commit 进入了commit信息书写页面,大多数人因为不太熟悉vim的操作导致不知怎么结束编写,就进行了直接关闭控制台的操作,但是此时git ...

  8. gulp的安装以及less插件安装与使用

    1.安装node.js 下载地址:http://nodejs.cn/download/ 这时我们输入 node -v  以及  npm -v  检查是否安装成功. 2.为了提高后续使用的快速,我们安装 ...

  9. IO流13 --- 转换流实现文件复制 --- 技术搬运工（尚硅谷）

    InputStreamReader 将字节输入流转换为字符输入流 OutputStreamWriter 将字符输出流转换为字节输出流 @Test public void test2() { //转换流 ...

  10. 用windows命令解压chm文件

    Windows里有这样一个工具:hh.exe.hh.exe最重要的功能就是用来关联CHM文件,当你运行一个chm文件的时候,系统就是用这个工具来打开的. 其实它还有另外一个功能——解压CHM文件在CM ...