1、DOM结构——两个节点之间可能存在哪些关系以及如何在节点之间任意移动。
document.documentElement     返回文档的根节点<html> 
document.body     <body> 
document.activeElement 返回当前文档中被击活的标签节点(ie) 
event.fromElement        返回鼠标移出的源节点(ie) 
event.toElement       返回鼠标移入的源节点(ie) 
event.srcElement     返回激活事件的源节点(ie) 
event.target         返回激活事件的源节点(firefox) 
当前对象为node 
返回父节点：node.parentNode, node.parendElement, 
返回所有子节点：node.childNodes（包含文本节点及标签节点）,node.children 
返回第一个子节点：node.firstChild 
返回最后一个子节点： node.lastChild 
返回同属上一个子节点：node.nextSibling 
返回同属下一个子节点：node.previousSibling 
parentNode和parentElement功能一样，childNodes和children功能一样。但是parentNode和childNodes是符合W3C标准的，可以说比较通用。而另外两个只是IE支持，不是标准，Firefox就不支持 ,所以大家只要记得有parentElement和children就行了

2、DOM操作——怎样添加、移除、移动、复制、创建和查找节点。
（1）创建新节点
      createDocumentFragment()    //创建一个DOM片段
      createElement()   //创建一个具体的元素
      createTextNode()   //创建一个文本节点
（2）添加、移除、替换、插入
      appendChild()
      removeChild()
      replaceChild()
      insertBefore()
（3）查找
      getElementsByTagName()    //通过标签名称
      getElementsByName()    //通过元素的Name属性的值
      getElementById()    //通过元素Id，唯一性

3、事件——怎样使用事件以及IE和DOM事件模型之间存在哪些主要差别。
（1）冒泡型事件：事件按照从最特定的事件目标到最不特定的事件目标(document对象)的顺序触发。
  IE 5.5: div -> body -> document
  IE 6.0: div -> body -> html -> document
  Mozilla 1.0: div -> body -> html -> document -> window
（2）捕获型事件(event capturing)：事件从最不精确的对象(document 对象)开始触发，然后到最精确(也可以在窗口级别捕获事件，不过必须由开发人员特别指定)。
（3）DOM事件流：同时支持两种事件模型：捕获型事件和冒泡型事件，但是，捕获型事件先发生。两种事件流会触及DOM中的所有对象，从document对象开始，也在document对象结束。
  DOM事件模型最独特的性质是，文本节点也触发事件(在IE中不会)。

理解js的DOM操作的更多相关文章

  1. js的dom操作（整理）（转）

    js的dom操作整理(整理)(转) 一.总结 一句话总结: dom操作有用原生js的dom操作,也可以用对js封装过的jquery等插件来来更加方便的进行dom操作 1.dom是什么? 对于JavaS ...

  2. js的DOM操作整理（整理）

    js的DOM操作整理(整理) 一.总结 一句话总结: dom操作有用原生js的dom操作,也可以用对js封装过的jquery等插件来更加方便的进行dom操作 1.dom是什么? 对于JavaScrip ...

  3. JS的DOM操作及动画

    JS的DOM操作DOM:Document Object ModelBOM:Bowers(浏览器) Object Model找到元素:var a=document.getElementById(&quo ...

  4. JS的DOM操作语法

    整理了一下JS的DOM操作语法,这里做下记录. <!DOCTYPE html> <html> <head> <meta charset="utf-8 ...

  5. JS的DOM操作 - 你真的了解吗?

    摘要 想稍微系统的说说对于DOM的操作,把Javascript和jQuery常用操作DOM的内容归纳成思维导图方便阅读,同时加入性能上的一些问题. 前言 在前端开发的过程中,javascript极为重 ...

  6. 总结js常用的dom操作（js的dom操作API）

    转载:https://www.haorooms.com/post/js_dom_api 前言 很多同学用惯了jquery操作dom,让他们用js操作的时候,常常力不从心,本文总结了常用的js的dom操 ...

  7. 事件冒泡及事件委托的理解（JQuery Dom操作）

    jQuery事件冒泡: click mouseenter 等事件没有绑定 也会触发,只是触发后没有任何结果 子元素触发事件后,会把触发事件传递给父元素,那么父元素也会被触发. 不管有没有绑定事件,都会 ...

  8. 原生js封装dom操作库

    var utils = (function(window) { var flag = "getComputedStyle" in window; function win(attr ...

  9. 5月16日上课笔记-js中DOM操作

    一.DOM操作 DOM节点的操作 增加 删除 修改 节点的信息: nodeName 获取节点的标签名 parentNode 获取父节点 childNodes IE忽略回车换行,chrome回车换行是文 ...

随机推荐

  1. leetcode -- Best Time to Buy and Sell Stock III TODO

    Say you have an array for which the ith element is the price of a given stock on day i. Design an al ...

  2. U盘重装Windows系统

    1.制作一个U盘老毛桃或者大白菜 2.进入BIOS 3.Secure Boot-Disabled,作用是关闭微软的Secure BOOT,这个功能开启会导致不能识别U盘启动系统的安装 4.Lauch ...

  3. 使用UE4.16开发Oculus需要Oculus软件版本高于1.11

    使用UE4.16开发Oculus,需要Oculus App Version大于1.11

  4. JVM内存简析

    1.程序计数器: 这是一块较小的内存空间,它的作用可以看作是当前线程所执行的字节码的行号指示器,线程私有. 2.Java虚拟机栈: 它是Java方法执行的内存模型,每一个方法被调用到执行完成的过程,就 ...

  5. Django学习笔记第五篇--实战练习一--查询数据库并操作cookie

    一.启动项目: django-admin start mysite1 cd mysite1 python manage.py startapp loginapp 根据上文敲命令就可以创建好了一个项目结 ...

  6. mysql用sql创建表完整实例

    create table user_login_latest( id int(11) unsigned NOT NULL AUTO_INCREMENT, user_id int(11) not nul ...

  7. 日期选择时两个日期之间的动态控制--My97datepicker日期选择控件

    实现效果:如果先选离店日期,再选入住日期的话,入住日期大于离店日期则离店日期+1天否则离店日期不变,先选入店再选离店离店,离店只能选之后的日期,且两个日期之间最多间隔88天 <div class ...

  8. Node REPL

    Node 自带了交互式解释器,可以执行以下任务: 读取 - 读取用户输入,解析输入了Javascript 数据结构并存储在内存中. 执行 - 执行输入的数据结构 打印 - 输出结果 循环 - 循环操作 ...

  9. Spring 拦截器的使用

    一.Web.xml配置 在Web.xml 配置Spring核心控制器DispatcherServlet接收所有请求 <servlet> <servlet-name>spring ...

  10. HDU_5532_Almost Sorted Array

    Almost Sorted Array Time Limit: 4000/2000 MS (Java/Others)    Memory Limit: 262144/262144 K (Java/Ot ...