码迷,mamicode.com
首页 > 其他好文 > 详细

对象的删除与创建

时间:2015-07-30 19:29:31      阅读:106      评论:0      收藏:0      [点我收藏+]

标签:javascript   对象   创建   删除   

1.删除对象:

(1)、找到对象;

(2)、找到它的父对象parentObj;

(3)、parentObj.removeChild(子对象);

<input type="button" value="删除最后一个li" onclick="del();" />
<ul>
     <li>春</li>
     <li>夏</li>
     <li>秋</li>
     <li>冬</li>
</ul>
<script type="text/javascript">
    //删除最后一个li
    function del(){
        var lis = document.getElementsByTagName('li');
        var lastli = lis[lis.length-1];
        lastli.parentNode.removeChild(lastli);
    }
</script>


2.创建对象:

(1)、创建对象;

(2)、找到父对象parentObj;

(3)、parentObj.addChild(对象);

<input type="button" value="增加一个li" onclick="add();" />
<ul>
    <li>春</li>
    <li>夏</li>
    <li>秋</li>
</ul>

<script type="text/javascript">
    //增加一个li    
    function add(){
        var li = document.createElement('li');
        var txt = document.createTextNode('冬');
        li.appendChild(txt);
        document.getElementsByTagName('ul')[0].appendChild(li);
    }
</script>

3.暴力操作节点

innerHTML:代表节点内的内容,能读能写,不是一个w3c规定的标准对象属性,但是各个浏览器支持很好。

<input type="button" value="添加春夏秋" onclick="add3()" />
	<input type="button" value="添加冬" onclick="add1()" />
	<ul></ul>
	<script type="text/javascript">
	function add3(){
		var ul = document.getElementsByTagName('ul')[0];
		ul.innerHTML = '<li>春</li><li>夏</li><li>秋</li>';
	}
	function add1(){
		var ul = document.getElementsByTagName('ul')[0];
		ul.innerHTML += '<li>冬</li>';
	}
	</script>


版权声明:本文为博主原创文章,未经博主允许不得转载。

对象的删除与创建

标签:javascript   对象   创建   删除   

原文地址:http://blog.csdn.net/bluedream1219/article/details/47154331

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!