日期:2014-05-16  浏览次数:20325 次

javascript学习之DOM模型(一)

1.访问相关节点

var ohtml = document.documentElement;

\\\\\方法一

var ohead = ohtml.firstChild;

var obody = ohtml.lastChild;

\\\\\\方法二

var ohead = ohtml.childNodes[0]

var obody = ohtml.childNodes[1];

getElementsByTagname("xxx")

获取标签名称为xxx的tag的元素集合

getElementsByName("xxx")

获取元素名称为xxx的集合

元素.getAttribute("")   setAttribute("xx" , newvalue)   removeAttribute("xx")

对于属性的增删改查

getElementById("ddd")

获取id为ddd的元素

2.节点的增删改查

var op = document.createElement("p")
var otext = document.createTextNode("Helloworld")
op.appendChild(otextf)
document.body.appendChild(op)
var op = document.getElementById("aa")
document.body.removeChild(op)
不过 最好还是用父节点的方式保证每次都访问的目标节点的父节点 避免混乱 如下:
op.parentNode.removeChild(op);
var onew = 新的节点 
var old = document.body.getElementById("aa")
old.parentNode.replaceChild(onew , old)
var onew = 新的节点 
var old = document.body.getElementById("aa")
old.parentNode.insertBefore(onew , old)

3.文档碎片

当需要一次性建立多个内容然后插入到页面中时候 由于每一次插入会造成一次页面更新 ,所以需要
创建一个文档碎片 将新的文档插入进去 然后一次性加入到页面当中
var frag = document.createDocumentFragment();
for(var i = 0;i < 10;i++) {
友情链接: 爱易网 云虚拟主机技术 云服务器技术 程序设计技术 开发网站 APP开发教程
Copyright © 2013-2024 爱易网页 当前在线:345人  网站在43分10秒内访问总人数:12132人 当前 25.66%  粤ICP备18100884号-2