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 使用不同的节点类型 克服浏览器兼容性问题及各种陷阱 DOM 是针对 HT...
    闷油瓶小张阅读 659评论 0 1
  • 1.创建节点 createElement()var node = document.createElement(“...
    奶油小生Cc阅读 759评论 0 2
  • appendChild() 用于向 childNodes 列表的末尾添加一个节点,添加节点后,childNodes...
    lx_smile阅读 231评论 0 1
  • 头文件的声明注意事项 在声明类时,最好将类的声明放在头文件中,并且使用#ifndef xxxx 进行处理,防止重复...
    DemonWNB阅读 409评论 0 0
  • 冬至,24节气中最早被制定的一个节气,古代被当作一个较大的节日,曾今有冬至大如年的说法,阴极之至,阳气始生,日南至...
    想飞的树不如草阅读 163评论 5 0