DOM操作节点

节点操作

每一个节点都有一个childNodes属性 其中保存着一个nodeList对象(类数组)可以动态查询DOM结构变换会自动反映到NodeLIst中
eg;
var firstChild=obj.childNodes[0]===var firstChild=obj.childNodes.item(1) item方法获取第一个

具有length属性的 的对象转化真真正的数组

1 var toArray = function(s){
2 try{
3 return Array.prototype.slice.call(s);//针对IE8以及以下的因为IE8 那个时候NodeList是COM对象7
4 } catch(e){
5 var arr = [];
6 for(var i = 0,len = s.length; i < len; i++){
7 //arr.push(s[i]);
arr[i] = s[i]; //据说这样比push快
8 }
9 return arr;
10 }
11 }
直接说节点
获取
parentNode 父节点唯一元素节点 (offsetParent 最近的定位父级)
childNodes 所有的节点 children 所有的元素节点
nextSlibing nextElementSibling(H5新加)后一个兄弟 节点 元素
previousSbling previousSibling(H5)前一个兄弟
lastChild firstChild
操作
appendChild()
insertBefore()
replaceChild(new,old,index)
removeChild()
cloneNode()
文档节点
document.documentElement//html
document.body//body
以上2个所有浏览器都支持
document.documentType//文档声明 Ie8 为空
文档信息
document.url//完整的url
document.domian//域名(可设置)//可以解决跨域
documet.referrer
一些偏门获取 上节提过 加以补充记得是document下的对象o images可以不用
images[0]//第一个img
images.namedItem["有name的img元素的name"]==images[“name”]
document.images[] document.forms[] document.links[] document.ahchors[] (带有name的a)


不看不知道一看真是的怎么还有这么多不知道

你可能感兴趣的:(DOM操作节点)