js DOM(Document Object Model)——文档对象模型

DOM(DocumentObjectModel)——文档对象模型

一个网页是一个文档。这个文档可以被显示在浏览器窗口中,也可以以html源码的形式显示。

DOM提供了另一种方式来表示,存储,操作这个文档。DOM是网页的一种完全的面向对象的表示方法,可以通过脚本语言(比如说JavaScript)来改变。

DOM与BOM的关系?——BOM包含DOM

document对象有三个强大的方法,可以获取页面的任何元素

1.

var p1 = document.getElementById("p1");
        //获取ID为p1的那个元素
	//在一个文档中ID必须是唯一的,getElementById方法只会返回一个元素    alert(p1.tagName);

2.

var allP = document.getElementsByTagName("p");
  //获取文档中所有p标签
  //因为页面中标签相同的元素很多,所以即使页面中只有一个p素,getElementsByTagName也会返回一个集合
  for (var i=0;i < allP.length;i++) {
		alert(allP[i].innerHTML);//像数组一样访问其中的每个元素
	}

2.1getElementsByTagName还可以使用通配符*来获取所有的元素

var allTags = document.getElementsByTagName("*");
	alert(allTags.length);

2.2更强大的是,getElementsByTagName不但可以在document对象上调用,也可以在其它HTML元素上调用

var p2 = document.getElementById("p2");
	var p2ps = p2.getElementsByTagName("em");//将获取p2下面的em元素,而不获取p2之外的em
	//还有一个通过name来获取元素的方法:getElementsByName

3.

var radios = document.getElementsByName("check");
  //获取所有name为check的元素

4.获取和设置元素属性——getAttribute与setAttribute方法

var p1 = document.getElementById("p1");
	alert(p1.getAttribute("id"));
	p1.setAttribute("title","Value");

相关推荐