<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>给div中添加文本元素</title>
<style type="text/css">
div{
border: 1px solid blue;
background-color: green;
width: 300px;
height: 150px;
}
</style>
<script type="text/javascript">
function demo(){
//在这个方法中主要是给div中添加文本元素
//先创建一个文本节点
var textNode = document.createTextNode("我是动态添加进来的");
//获取div对象
var divNode = document.getElementById("div");
//给div添加文本元素
divNode.appendChild(textNode);
}
function demo2(){
//在这个方法中主要是给div中添加文本元素
//先创建一个超链接对象
var aNode = document.createElement("a");
aNode.href = "http://sh.itcast.cn";
//aNode.setAttribute("href","http://sh.itcast.cn");
aNode.innerHTML = "上海传智播客";
//获取div对象
var divNode = document.getElementById("div");
//给div添加文本元素
divNode.appendChild(aNode);
}
</script>
</head>
<body>
<div id="div" >
我是动态添加进来的
<a href="#">超链接</a>
</div>
<input type="button" value="给div上添加文本" onclick="demo()"/>
<input type="button" value="给div上添加超链接" onclick="demo2()"/>
</body>
</html>