JS操作DOM元素代码的编写

JS操作DOM元素代码的编写

DOM树

传统的html文档顺序是:document->html->(head,body)

根据 DOM，HTML 文档中的每个成分都是一个节点。 整个文档是一个文档节点  每个 HTML 标签是一个元素节点  包含在 HTML 元素中的文本是文本节点  每一个 HTML 属性是一个属性节点  注释属于注释节点 

一、document对象(DOM核心对象) 1、dom属性   title  返回或设置当前文档的标题   URL    返回当前文档的url   bgColor 设置文档的背景色   fgColor  设置文档的前景色(设置文字颜色)

   alert(document.title)
   document.title="HelloWorld";
   alert(document.URL)
   alert(location.href)
   document.bgColor="red";
   document.fgColor="blue";

2.dom获取节点方法    getElementById(idname)  返回拥有指定id的（第一个）对象的引用

   getElementsByTagName(tagname)  返回带有指定标签名的对象的集合 

   getElementsByName(name)  返回带有指定name指定名称的对象的集合，主要是适用于表单

   write() 

 缺点 1.浪费内存 2.逻辑性不强。一般通过节点之间的关系属性获取节点

 window.onload=function  () {
    //方法 getElementById(idname)
    var div1=document.getElementById("one");
	alert(div1.innerHTML)

    //getElementsByTagName(tagname)
  var divs=document.getElementsByTagName("div");
  var lengths=divs.length;
  //alert(lengths)
  //通过下标来访问
    //alert(divs[1].innerHTML)
	for (var i=0; i