DOM属性：
1、firstChild firstElementChild
1.1、firstChild : 在IE9+和其他标准浏览器中，div与p之间的空白区域被认为是第一个子节点为空白节点（即文本节点），div显示数字3
1.2、firstElementChild 可以把空白部分清空，读取正确的节点位置值
2、nodeName、nodeValue、nodeType
2.1、在文档对象模型 (DOM) 中，每个节点都是一个对象。DOM 节点有三个重要的属性 ：
nodeName : 节点的名称
nodeValue ：节点的值
nodeType ：节点的类型
一、nodeName 属性: 节点的名称，是只读的。
1. 元素节点的 nodeName 与标签名相同
2. 属性节点的 nodeName 是属性的名称
3. 文本节点的 nodeName 永远是 #text
4. 文档节点的 nodeName 永远是 #document
二、nodeValue 属性：节点的值
1. 元素节点的 nodeValue 是 undefined 或 null
2. 文本节点的 nodeValue 是文本自身
3. 属性节点的 nodeValue 是属性的值
三、nodeType 属性: 节点的类型，是只读的。以下常用的几种结点类型:
元素类型 节点类型
元素 1
属性 2
文本 3
注释 8
文档 9
3、getAttribute()方法 和getAttributeNode() 方法
定义： 通过元素节点的属性名称获取属性的值。如：title、id、class等值；
3.1、 var text=con[i].getAttribute("title")与var text=con[i].title 有什么区别吗？
答：title点操作符和getAttribute获取到的属性值没区别。点操作符 只能对html里面本身就有的标签操作getAttribute能跟点操作符一样获取操作，还能对自定义标签节点操作。比如<div title= "1" abcd="5"></div>这个标签里面的title两个都能获取操作。而abcd只能getAttribute获取操作，点操作符获取不到。
4、setAttribute()方法
定义：增加一个指定名称和值的新属性，或者把一个现有的属性设定为指定的值 ，elementNode.setAttribute(name,value)
如：var Lists=document.getElementsByTagName("li"); ///标签名可能有多个，返回数组；
Lists[i].setAttribute("title","Web前端技术");
注1：在增加属的“事件响应”时必须用setAttribute方法，直接采用 elementNode.type="XXX"创建事务响应无效；
注2：通过setAttribute创建样式：
firefox等可以使用
var dom=document.getElementById("name");
dom.setAttribute("style","width:10px;height:10px;border:solid 1px red;") ;
IE中则必须使用style.cssText
var dom=document.getElementById("name");
dom1.style.cssText = "width:10px;height:10px;border:solid 1px red;";
补充一下，目前style.cssText类似innerHTML了，已经成为一个web开发的事实标准。因此测试显示firefox浏览器也支持这种方式。
5、innerHTML和innerText 的应用和区别
innerHTML返回的是标签内的 html内容，包含html标签。
innerText返回的是标签内的文本值，不包含html标签。
6、innerHTML和createTextNode的区别：
都可以把一段内容添加到一个节点中，区别是如果这段内容中有html标签（如例子中的<strong></strong>）时表现就不同了，在createTextNode中会当作文本处理，不会被浏览器解析，但用innerHTML就会被当作HTML代码处理（如你的例子中Hello会被加粗显示）。
7、innerHTML和createTextNode的区别
var body =document.body;
var pment=document.createElement("p");
pment.className="message";
pment.innerHTML="I Love you!";
body.appendChild(pment);
或 var textNode =document.createTextNode("I Love you!");
pment.appendChild(textNode);
注：createTextNode 需要appendChild配合插入；
而innerHTML 直接赋值；
8、窗口与滚动条的位置：
scrollLeft:设置或获取位于给定对象左边界与窗口中目前可见内容的最左端之间的距离 ，即左边灰色的内容。（如：div1横向滚动条滚动的距离）
scrollTop:设置或获取位于对象最顶端与窗口中可见内容的最顶端之间的距离 ，即上边灰色的内容。（如：div1纵向滚动条滚动的距离）
offsetLeft:获取指定对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置 。（如：div距离屏幕左部的距离） 。
offsetTop:获取指定对象相对于版面或由 offsetParent 属性指定的父坐标的计算顶端位置（如：div距离屏幕顶部的距离） 。
9、for里的XX[i]与this为什么不能混用：
主要还从执行顺序来看：
for循环先执行,为每一个元素对象绑定事件;//每个元素绑定了事件,并未执行
for循环结束后,i的值变为length;//所以this不能替换为trs[i],此时的trs[i]为trs[length],不存在,undefined
触发事件,执行方法体.//因为此时的元素对象才都绑定了事件,所以可以执行.
注：this若在某个为windows下的函数内时，其实是指向windows而不是当时对象； 如setTimerout，是windows下的函数内时。
10、setTimeout 和 setInterval 定时器的区别：
10.1、setTimeout: 此为超时调用，即时间到后才调用里面的函数方法；
格式： XX=setTimeout(function(){},时间毫秒)；
或 setTimeout(function(){});
10.2、setInterval() 方法会不停地调用函数，直到clearInterval()被调用或窗口被关闭；
由setInterval()返回的ID值，可用作clearInterval()方法的参数；
最新评论