javascript的节点的概念
<html>
<head>
<title></title>
</head>
<body> </body>
</html>
文档节点是每个文档的根节点.
在我们的页面中,文档节点只有一个子节点即<html>.我们称之为文档元素.在XML中,没有预定义的元素,因此任何元素都有可能成为文档元素
javsccript中的所有节点类型都继承自Node类型.所以所有的节点都有着相同的基本属性和方法.
没个节点都有一个nodeType属性.用于表明节点的类型.
NODE.ELEMENT_NODE 1
NODE.ATTRIBUTE_NODE 2
NODE.TEXT_NODE 3
NODE.CDATA_SECTION_NODE 4
NODE.ENTITY_REFERENCE_NODE 5
NODE.ENTITY_NODE 6
NODE.PROCESSING_INSTRUCTION_NODE 7
NODE.COMMENT_NODE 8
NODE.DOCUMENT_NODE 9
NODE.DOCUMENT_TYPE_NODE 10
NODE.DOCUMENT_FRAGMENT_NODE 11
NODE.NOTATION_NODE 12
window.onload = function () {
var oDiv = document.getElementById("guoDiv");
if (oDiv.nodeType == Node.ELEMENT_NODE) {//在IE下会报错
alert("不好暴露了");
}
else
alert("没被发现");
}
上面的代码(Node.ELEMENT_NODE)在IE中会报错,
因为IE没有公开NODE的类型构造函数.
为了确保浏览器的兼容性,可以这个样子写
window.onload = function () {
var oDiv = document.getElementById("guoDiv");
if (oDiv.nodeType == 1) {//在IE下会报错
alert("不好暴露了");
}
else
alert("没被发现");
}
要了解节点的具体信息,可以使用nodeName和nodeValue这两个属性
window.onload = function () {
var oDiv = document.getElementById("guoDiv");
alert(oDiv.nodeName); //DIV
alert(oDiv.nodeValue);//null
}
每个节点都有一个childNodes属性,其中保存着一个NodeList对象.
NodeList是一种类数组对象,用于保存一组有序的节点,可以通过位置来访问这些节点.
注意NodeList不是Array实例.虽然他有length属性,也可以通过方括号访问NodeList值.
NodeList对象的独特之在于,它实际上是基于DOM结构动态执行查询的结果,因此DOM结构的变化能够自动反映在ModeList对象上.
所以NodeList是有生命,有呼吸,而不是在我们第一次访问他们的属性时拍摄下来的一张快照.
window.onload = function () {
var oDiv = document.getElementById("divFather");
var firstChild = oDiv.childNodes[1];
alert(firstChild.innerHTML);//
}
NodeList不是数组,那么就不能使用数组的方法了.
下面是将NodeList转换成数组
function converToArray(nodes) {
var array = null;
try {
array = Array.prototype.slice.call(nodes, 0); //针对非IE
}
catch (e) {
array = [];
for (var i = 0, len = nodes.length; i < len; i++) {
array.push(nodes[i]);
}
}
return array;
}
javascript的节点的概念的更多相关文章
- 前端之javascript的节点操作和Event
一 节点的增删改查 创建节点:createElement(标签名):创建一个指定名称的节点. 追加节点: 追加一个子节点:somenode.appendChild(标签名) 指定某个位置前面添加一个节 ...
- JavaScript入门几个概念
JavaScript入门几个概念 刚刚入门JavaScript的时候,搞懂DOM.BOM以及它们的对象document和window很有必要. DOM是为了操作文档出现的API,document是它的 ...
- Javascript高级程序设计——基本概念(一)
一.语法 EMCA-262通过叫做ECMAScript的“伪语言”为我们描述了javascript实现的基本概念 javascript借鉴了C的语法,区分大小写,标示符以字母.下划线.或美元符号($) ...
- javascript判断节点是否在dom
在项目中碰到同事写的一段代码: //焦点必须在实时dom树中 if (ele && typeof this.document.contains === "function&q ...
- javascript创建节点的事件绑定
javascript创建节点的事件绑定 timeupdate事件是<video>中用来返回视频播放进度的事件,绑定在<video>标签返回视频播放位置(每秒计). 现video ...
- JavaScript基础1——基本概念
关于JS的概念 JavaScript 是一种弱类型语言. JavaScript 是一种客户端脚本语言(脚本语言是一种轻量级的编程语言). JavaScript是基于对象的.(因为面向对象需要具有封装. ...
- JavaScript DOM节点和文档类型
以下的例子以此HTML文档结构为例: <!DOCTYPE html> <html lang="en"> <head> <meta char ...
- 【转】JavaScript获取节点类型、节点名称和节点值
DOM节点信息包括节点类型(nodeType).节点名称(nodeName)和节点值(nodeValue). 节点类型 DOM节点中,每个节点都拥有不同的类型.W3C规范中常用的 DOM节点类型有以下 ...
- javascript中闭包的概念
这个是每个前端工程师绕不开的一个问题,网上各种资料很多,整个春节,我仔细研读了红皮经典中关于这一块的注释,加深了对这一块的理解. 有好几个概念需要重申一下.以下都是我的理解: 1. 闭包是javasc ...
随机推荐
- grafana+influxdb+telegraf监控服务器cpu,内存和硬盘
随便抄了一篇,目前我们的项目也在用,这个是linux和windows通吃的一种监控方案,非常有效,详细和优美,需要监控什么具体的业务内容,自己向influxdb中插入就行了. 监控服务器状态是运维必不 ...
- 50个必备常用的jQuery代码段
1. 如何修改jQuery默认编码(例如默认UTF-8改成改GB2312): $.ajaxSetup({ ajaxSettings:{ contentType:"application/x- ...
- check camera and driver
1. How to check $ ls /dev/video* /dev/video0 /dev/video1 /dev/video2 /dev/video3 if not, U should ch ...
- java设计模——反射的应用 (利用反射来去除if判断语句)
利用反射来去除if判断语句 我的以前写的一个查分系统,就是部长让我写的那个,使用一个分发器(函数),他会根据传递进来的字符串参数调用不同的方. If(“add”.equalsIgnoreCase(fu ...
- WIN 10系统下,在DOS窗口输入Java或者javac出现乱码的解决方法
昨天在WIN10系统下完成了Java环境的安装配置,配置完成后验证环境的时候出了一个小插曲—输入java后窗口内中文字符出现乱码,如下图. 在经过一番google之后,发现,原来是我cmd窗口的代码页 ...
- CTF-练习平台-Misc之 隐写2
二.隐写2 下载文件后解压,发现是一个png图片,依照老套路查看属性,没有发现 用WinHex打开,在图片文件中,修改图片宽度,将箭头处的A改为F,保存后打开图片 发现flag(对于png的文件格式详 ...
- ubuntu 安装php 报错解决
安装php时候遇到的问题: dpkg: 处理软件包 php7.1-opcache (--configure)时出错: 依赖关系问题 - 仍未被配置dpkg: 依赖关系问题使得 php7.1-readl ...
- dbt 包的构建
dbt的包是一种可以复用的代码,可以方便进行模型的共享 创建一个包 和普通的dbt 项目类似 初始化(init) dbt init [packagename] 目录结构 文件: README.md d ...
- 【MVC】Model的使用
1,Model的职责: Model只负责与数据处理相关的工作. 2,开发Model的基本观念 采用ORM信息访问技术开发 ORM是将结构化的关系型数据,映射成面向对象模型.对于EF来说,就是关系型数据 ...
- RAII vs. exceptions
析构函数不能抛出异常, 原因 析构函数已经变成了异常处理的一部分 如果对象出了异常,现在异常处理模块为了维护系统对象数据的一致性,避免资源泄漏,有责任释放这个对象的资源,调用对象的析构函数,可现在假如 ...