js文档对象模型(DOM)

来源：互联网发布：java多线程简单实例编辑：程序博客网时间：2024/06/05 12:48

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>js文档对象模型(DOM)</title>
<script type="text/javascript">
/*
document 文档对象
属性：document.bgColor
document.fgColor
document.body.style.backgroundColor
方法：
document.write("动态输出内容");
document.writeln("");
document.getElementById("ID值"); //单个元素对象
document.getElementByName("名称");//数组，集合
document.getElementsByTagName("标签名称");//数组，集合

标签：
块级容器：自动换行 block
内联容器：不换号 inline
display:none;
*/

function ok(){
//通过name获得元素的数组
//var y=document.getElementsByName("xx");

//通过标签名称获得元素的集合
var y=document.getElementsByTagName("p");

//循环弹出
for(var i=0;i<y.length;i++){
alert(y[i].innerText);
}

//innerText里放标签不能被解析
y[1].innerText="到后来才发现";

//innerHTML里可以放html标签
y[2].innerHTML="<font color='orange'><b>到后来才发现</b></font>";
}
</script>
</head>

<body>
<form>
<p name="xx">好好学习，天天向上</p>
<p>今天天气很好</p>
<p name="xx">我要我们在一起</p>
<h2>今天天气很好</h2>
<input type="button" value="点击我" onclick="ok();"/>
</form>
</body>
</html>

0 0