DOM
document(文档)
object(对象)
model(模型)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<title>shopping list</title>
</head>
<body>
<h1>what to buy</h1>
<p title="a gentle reminder">don't forgrt to buy this stuff.</p>
<ul id="purchases">
<li>a tin of beans</li>
<li class="sale">cheese</li>
<li class="sale important">milk</li>
</ul>
</body>
</html>
文本段落元素“p”,无序段落元素“ul”,列表项元素“li”
文本节点
<p>元素包含着文本“
don't forgrt to buy this stuff.”
属性节点
title="a gentle reminder"
1.class属性
可以在所有元素上任意应用class属性:
<li class="sale">cheese</li>
<li class="sale important">milk</li>
<li class="sale important">milk</li>
2.id属性
给网页里的某个元素加上一个独一无二的标识符
<ul id="purchases">
获取元素
alert(typeof document.getElementById("purchases"));
for(var i=0;i<document.getElementsByTagName("li").length;i++)
alert(typeof document.getElementsByTagName("li")[i]);
var items = document.getElementsByTagName("li");
for(var i=0;i<items.length;i++)
alert(typeof items[i]);
alert(document.getElementsByTagName("*").length);
通配符(星号字符“*”)必须放在引号里
var shopping = document.getElementById("purchases");
var sales = shopping.getElementsByClassName("sale");
alert(sales.length);
只要类名中包含sale就会被计算在内
var paras = document.getElementsByTagName("p");
for(var i=0;i<paras.length;i++)
{
var title_text=paras[i].getAttribute("title");
if(title_text)
alert(title_text);
}
var shopping = document.getElementById("purchases");
alert(shopping.getAttribute("title"));
shopping.setAttribute("title","a list of goods");
alert(shopping.getAttribute("title"));
setAttributes做出的修改不会反应在文档本身的源代码中