在末尾添加节点
第一步：获取到ul标签
第二步：创建li标签
- document.createElement("标签名称")方法
第三步：创建文本
- document.createTextNode("文本内容");
第四步：把文本添加到li下面
- 使用 appendChild方法
第五步：把li添加到ul末尾
- 使用 appendChild方法
<html >
<head>
<title>HTML示例</title>
<style type = "text/css">
div{
width:100px;
height:100px;
border:2px solid gray;
}
</style>
</head>
<body>
<div >
<ul id="ulid">
<li >马化腾</li>
<li >马云</li>
<li >雷军</li>
</ul>
</div>
<input type="button" value="add" onclick="add1()" />
</body>
<script type="text/javascript">
function add1(){
/*
1.获取ul标签
2.创建li标签
3.创建文本
4.把文本添加到li下面
5.把li添加到ul末尾
*/
var ul1 = document.getElementById("ulid");
var li1 = document.createElement("li");
var tex = document.createTextNode("马文军");
li1.appendChild(tex);
ul1.appendChild(li1);
}
</script>
</html>效果图