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. 04_Spring AOP两种代理方法

    什么是AOP?           AOP为Aspect Oriented Programming的缩写,意为:面向切面编程,通过预编译方式和运行期动态代理实现程序功能的统一维护的一种技术.AOP是O ...

  2. <每日一题>题目17:super()继承相关的面试题

    class A(object): def go(self): print("go A go!") def stop(self): print("stop A stop!& ...

  3. C#绘制渐变背景

    //绘制渐变色背景 Graphics g = e.Graphics; LinearGradientBrush linearGradientBrush = new LinearGradientBrush ...

  4. 记录下sparkStream的做法(scala)

    一直用storm做实时流的开发,之前系统学过spark但是一直没做个模版出来用,国庆节有时间准备做个sparkStream的模板用来防止以后公司要用.(功能模拟华为日常需求,db入库hadoop环境) ...

  5. 732F Tourist Reform

    // CF 732F Tourist Reform // 思路:两遍tarjan // 找强联通分量 #include <bits/stdc++.h> using namespace st ...

  6. PHP SSH2 不支持 IdentityFile

    有的情况下 我们会用到 类似命令行 sftp -o IdentityFile=.ssh/identity  username@host方式 登陆, 想用php 操作, 但是 php 现在看是不支持的, ...

  7. 第四章 Odoo 12 开发之模块继承

    Odoo 的一个强大功能是无需直接修改底层对象就可以添加功能.这是通过其继承机制来实现的,采取在已有对象之上修改层来完成.这种修改可以在不同层上进行-模型层.视图层和业务逻辑层.我们创建新的模块来做出 ...

  8. struts1 总结吧

    以前都是使用struts2,但是新公司要使用struts1,所有只有硬着头皮上了. 一.Dynamic Method Invoc : 自定义的 Action 必须继承 DispatchAction 而 ...

  9. V8：V8(Javascript引擎)

    ylbtech-V8:V8(Javascript引擎) Lars Bak是这个项目的组长,目前该JavaScript引擎已用于其它项目的开发.第一个版本随着第一个版本的Chrome于2008年9月2日 ...

  10. @EnableAsync使用

    EnableAsync注解的意思是可以异步执行,就是开启多线程的意思.可以标注在方法.类上. 1 @Component 2 public class Task { 3 4 @Async 5 publi ...