JS删除和创建节点

1.删除节点

设计一个按钮，通过点击按钮来实现删除最后一个节点
通过点击delect the last li来依次删除文本冬，秋，夏，春以及文本前得li节点
引入方法obj.parentNode.removeChild();用于删除节点

<!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=utf-8" />
<title>删除对象</title>
<script>
function del(){
    var li =document.getElementsByTagName('li');//获取li的对象集合
     var lastli =li[li.length-1];//定义最后一个li对象节点
     lastli.parentNode.removeChild(lastli);//通过方法删除节点
}
</script>
</head>
<body>
<input type="button" value="delect the last li" onclick="del();"/>
<ul>
<li>spring</li>
<li>summer</li>
<li>autumn</li>
<li>winter</li>
</ul>
</body>
</html>

2.创建节点

2.1创建li节点前面的小黑点

通过点击add the li按钮在原来的基础上来增加小黑点
引用obj.appendChild();

<script>
function add(){
    var li =document.createElement('li');//创建节点小黑点

     document.getElementsByTagName('ul')[0].appendChild(li);//通过方法实现
}
</script>
</head>

<body>
<input type="button" value="add the li" onclick="add();"/>
<ul>
<li>spring</li>
<li>summer</li>
<li>autumn</li>

</ul>

</body>

2.2创建li节点后面的文本

需要先创建所要增加的文本，然后通过appendChild();实现
即var text= document.createTextNode('winter');li.appendChild(text);