内容待补充。。。

DOM相关注意题目:

DOM的最小组成单位叫做
//节点 Node DOM 有自己的国际标准,目前的通用版本是
//DOM 3 DOM 树的根节点
//HTML 元素 Element 的 NodeType 值为
//1 和Node. ELEMENT_NODE <div id=x></div> x的值
//就是这个 id 为 x 的 div 对应的 Element 对象 document.body.nodeName
//"BODY" <div id=parent></div> parent的值
//如果有父窗口,就是父窗口。如果没有,就是当前窗口(不要用全局属性)
//如果想用,可声明一个函数,并立即调用.call(),或者直接() <div id=x></div>
<div id=y></div>
x.nextSibling 的值是
//回车构成的文本节点 <div id=parent1>
<div id=child1>
</div>
</div>
parent1.childNodes 的值是
//{0:child1, length:1} 伪数组 var parent = document.getElementById('parent');
parent.childNodes.length //
parent.appendChild(document.createElement('div'));
parent.childNodes.length
// 请问现在 length 是多少
//3 因为最后有用childNodes重新看子节点 var allDiv = document.querySelectorAll('div>
allDiv.length // 假设是 2
document.body.appendChild( document.createElement('div') )
allDiv.length
// 请问现在 length 的值是多少???
//2 因为alldiv是在第一步就取出来了,后面也没有重新取所以一直都是2 //以上题目为什么一个 length 会动态变化,另一个 length 却不会动态变化?
1 parent.childNodes 是动态集合。所谓动态集合就是一个活的集合,DOM树删除或新增一个相关节点,都会立刻反映在NodeList接口之中。 
 2 document.querySelectorAll方法返回的是一个静态集合。DOM内部的变化,并不会实时反映在该方法的返回结果之中。
ChildNode接口用于处理子节点(包含但不限于Element子节点)。Element节点、DocumentType节点和CharacterData接口,部署了ChildNode接口。凡是这三类节点(接口),都可以使用
// remove()、before()、after()、replaceWith() 节点的类型有七种,分别是
//Document、DocumentType、Element、Attribute、Text、Comment、DocumentFragment
//(这三种不是:Doctype、Tag、TextElement)

HTMLCollection和NodeList的区别

在用原生javascript选择器获取dom元素的时候。能直接返回

元素的也仅仅只有以下两条

var dom1=document.getElementById("a");
var dom2=document.querySelector("#a");

这两种选择器返回的是a元素。

而其他的选择器,大部分返回的结果是HTMLCollection,或者NodeList。

NodeList 对象是节点的集合,返回的是 Node 集合与 Node(取索引)。由 Node.childNodes 和 document.querySelectorAll 所返回的。

HTMLCollection 对象是元素的集合,返回是 Element 集合与 Element(取索引)。由node.children 和 node.getElementsByXXX

唯一要注意的是 querySelectorAll 返回的虽然是 NodeList ,但是实际上是元素集合,并且是静态的(其他接口返回的HTMLCollection和NodeList都是live的)

HTMLCollection与NodeList的区别有:

1 HTMLCollection实例对象的成员只能是Element节点,NodeList实例对象的成员可以包含其他节点。

2 HTMLCollection实例对象可以用id属性或name属性引用节点元素,NodeList只能使用数字索引引用。

DOM相关知识点的更多相关文章

  1. DOM相关知识点以及原型

    DOM(增删改查): 查询 1.获取元素 1.1标准DOM API document.getElementById document.getElementsByTagName document.get ...

  2. http及浏览器相关知识点归纳

    http是应用层协议,采用请求/响应模型 1.浏览器地址栏输入URL地址后发生了什么? 浏览器判断地址是否是合理的URL地址,是否是http协议请求,如果是则进入下一步 浏览器对此URL进行缓存检查: ...

  3. React其它相关知识点

    React其它相关知识点 一,解释一下React Fiber? 简单来说,核心就是在虚拟dom和浏览器的调用栈之间多了一个虚拟调用栈,和虚拟dom一样,这个虚拟调用栈也是在内存中的,这个虚拟调用栈就类 ...

  4. UITableView相关知识点

    //*****UITableView相关知识点*****// 1 #import "ViewController.h" // step1 要实现UITableViewDataSou ...

  5. Android开发涉及有点概念&相关知识点(待写)

    前言,承接之前的 IOS开发涉及有点概念&相关知识点,这次归纳的是Android开发相关,好废话不说了.. 先声明下,Android开发涉及概念比IOS杂很多,可能有很多都题不到的.. 首先由 ...

  6. IOS开发涉及有点概念&相关知识点

    前言,IOS是基于UNIX的,用C/C+/OC直通系统底层,不想android有个jvm. 首先还是系统架构的分层架构 1.核心操作系统层 Core OS,就是内存管理.文件系统.电源管理等 2.核心 ...

  7. IOS之UI--小实例项目--添加商品和商品名(使用xib文件终结版) + xib相关知识点总结

    添加商品和商品名小项目(使用xib文件终结版) 小贴士:博文末尾有项目源码在百度云备份的下载链接. xib相关知识点总结 01-基本使用 一开始使用xib的时候,如果要使用自定义view的代码,就需要 ...

  8. 学习记录013-NFS相关知识点

    一.NFS相关知识点 1.NFS常用的路径/etc/exports NFS服务主配置文件,配置NFS具体共享服务的地点/usr/sbin/exportfs NFS服务的管理命令,exportfs -a ...

  9. TCP/IP 相关知识点与面试题集

    第一部分:TCP/IP相关知识点 对TCP/IP的整体认 链路层知识点 IP层知识点 运输层知识点 应用层知识点 (这些知识点都可以参考:http://www.cnblogs.com/newwy/p/ ...

随机推荐

  1. DP:***24种设计模式--转自刘伟

    转自于高人的文章:http://blog.csdn.net/lovelion/article/details/17517213 2012年-2013年,Sunny在CSDN技术博客中陆续发表了100多 ...

  2. 数据的图表统计highcharts

    数据统计常用的图表一般是饼状图.柱状图.线状图,HighCharts可以很好的实现. HighCharts highcharts是基于jquery的一个功能强大的插件,使用时先导入jquery.js ...

  3. swift 类型备份

    Swift语法3.03(类型Types) https://www.jianshu.com/p/839f9bc4b9a3 https://developer.apple.com/library/cont ...

  4. RxSwift文档搜集与备份

    http://reactivex.io The Observer pattern done right ReactiveX is a combination of the best ideas fro ...

  5. sql 查询多列 小于某值

    select COUNT(*) from ( select ID,H1 AS Value from Table_1 union all select ID,H2 from Table_1 union ...

  6. 【转】【Oracle 集群】ORACLE DATABASE 11G RAC 知识图文详细教程之集群概念介绍(一)

    原文地址:http://www.cnblogs.com/baiboy/p/orc1.html 阅读目录 目录 集群概念介绍 什么是集群 为什么搭建数据库集群 数据库集群的分类 可扩展的分布式数据库架构 ...

  7. Airtest多设备跑

    一.   一个脚本对应一台设备 核心点:组织运行命令:将组织好的命令传到pool进程池(注意:是进程池,不是线程池,python的线程池不是同步执行,是按序执行) 以下不需要看,为私人项目备份目的. ...

  8. ELO kernels 记录

    these kernel for discuss how to handle outliers in target values. 一:Ashish Gupta: 在16年6月到18年8月,激活卡的人 ...

  9. 关于linux三种网络形式

    今天是开始的第一天,额,没什么仪式.舍友偶然间提醒我,应该把学习的东西,做一下规划和整理.我想一想也是对的.所以开通了这个.希望以后回来可以看看自己曾经的幼稚,那证明了我不断在学习在进步.最近在准备C ...

  10. python中字符串逆序的实现

    没有直接的逆序函数,有两种常用方式可将字符串逆序,一为切片,一为利用list的reverse,示例如下: #切片x=' y=x[::-1] #reverse函数 y=list(x) y.reverse ...