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

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

一个网页是一个文档。这个文档可以被显示在浏览器窗口中,也可以以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.1 getElementsByTagName还可以使用通配符*来获取所有的元素

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");

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值