2 xu dragon xu_dragon 于 2015.07.23 16:48 提问

删除子元素的一个小问题

我想要删除某个父元素下的某一类子元素:如下程序:
<!doctype html>



删除子元素
<br> .box{border:1px solid red;width:150px;height:150px;float:left;margin:20px 10px 0 20px;}<br>



删除box

function dele(){ var parent=document.getElementById("wrap"); var box=document.getElementsByClassName("box"); alert(box.length); //明明是三怎么只能删除两个盒子 for(var i=0;i<box.length;i++){ console.log(i); parent.removeChild(box[i]); } }



本来应该三个box都删除,可就是只能删除两个,这是什么样原因呢,弄了我一下午了,纠结,求解!谢谢

3个回答

lengmeiyanok
lengmeiyanok   2015.07.23 22:17

图片说明
刚在chrome中调试了,当删除一个box,box对象会减小一个, var box = document.getElementsByClassName("box"); box是对元素的引用,所以少
删除一个

代码修改成如下就可以:
function dele(){
var parent=document.getElementById("wrap");
var box=document.getElementsByClassName("box"); alert(box.length); //明明是三怎么只能删除两个盒子
/*for(var i=0;i<box.length;i++){
console.log(i); parent.removeChild(box[i]);
}*/
while(box[0]){
parent.removeChild(box[0]);
}
};

xu_dragon
xu_dragon 非常感谢!
接近 3 年之前 回复
u013080862
u013080862   2015.07.23 16:56

javascript数组索引是以1开头

u013080862
u013080862 解决方式:http://wangpfsir.blog.163.com/blog/static/67963727201043002658424/
大约 3 年之前 回复
u013080862
u013080862 回复m2582: 嗯,搞错了;
大约 3 年之前 回复
m2582
m2582 数组索引是以0开始的吧
大约 3 年之前 回复
cuiwei1026522829
cuiwei1026522829   Ds   Rxr 2015.07.24 00:48

删除的时候,记得脚标是从0开始的

Csdn user default icon
上传中...
上传图片
插入图片
准确详细的回答,更有利于被提问者采纳,从而获得C币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!
其他相关推荐
JS从一个元素中移除一个子元素
function DeleteCbText(id) { var txt =$("#" + id + "").attr("title"); var lis = $("#content").find("ul").find("li"); $(lis).each(function () { if ($(
怎么在div中创建子元素,删除子元素,删除所有的子元素
var addBtn = new Ext.Button({ text:'增加', handler:function(){ var aa = Ext.getCmp('txtName').getValue(); var _span = document.createElement('span'); var _div = document.getElementById("Mydivs");
使用Jquery随机删除一个顺序列表中某个子元素的方法,保持效果统一性
下面是我需要处理的一段DIV,其中有顺序排列的10张图片,我需要随机删除其中的某一种,依然保持一种顺序,让最好的一张保持留空。 其中尝试了好几张方法,都没有获得成功,非常奇怪,效果类似如下说明图: A BC DE FG H 比如用户随机删除B,效果变为:A CD EF GH
jquery随笔--删除元素或其子元素
$(document).ready(function(){     //删除ID为p1的元素   $("#but1").click(function(){     $("#p1").remove();   });     //删除DIV的子元素   $("#but2").click(function(){     $("#div1").empty();       });
js与jquery获取父元素,删除子元素的不同方法
var obj=document.getElementById("id");得到的是dom对象,对该对象进行操作的时候使用js方法 var obj=$("#id");得到的是jquery对象,对该对象进行操作的时候使用jquery方法 1.对于上面获得的对象进行遍历 (1).js方法  for(vat i=0;j (2).jquery方法  $(“#id”).each(function()
js 实现动态的添加或者删除子元素实例
div style="display:none" id="actual_ralationship"> div class="form-group"> label class="col-sm-2 control-label" style="padding-right: 8px;padding-left: 8px;">最多紧急联系人数量label>
js与jquery两种不同的方式获得父元素、删除子元素
var obj=document.getElementById("id");得到的是dom对象,对该对象进行操作的时候使用js方法 var obj=$("#id");得到的是jquery对象,对该对象进行操作的时候使用jquery方法 1.对于上面获得的对象进行遍历       (1).js方法  for(vat i=0;jobj[i] 来获得对应的某一个元素}       (2).jqu
js 删除一个节点的所有子元素节点的函数实现
我们知道,借助于第三方库,可以很方便地清空一个元素,即删除一个元素的所有子元素,如jQuery中的empty()函数,但是,原生js怎样实现这个功能呢,其实很简单,写一个循环就可以了,如下所示: function removeAllChild() { var div = document.getElementById("div1"); while(div.hasChildNode
JavaScript 添加或删除子节点、子元素
增加子节点或子元素时,首先要创建该元素(元素节点),然后向已经存在的元素节点添加,示例如下: 这是一个段落 这是另一个段落 var para=document.createElement("p");//创建需要增加的元素节点 var node=document.createTextNode("这是新段落。");//创建文本节点 para.appendChild(node);//将文本节点
jQuery - last-child 选择所有最后一个子元素 last最后一个元素
$(document).ready(function(){ //$('div p:last').addClass("red"); //$('div p:last') 选择 最后一个P元素 并高亮显示得出结果如下: $('div p:last-child').addClass("red");//$('div p:last-child') 将选择所有位于div最后一个p子元素,并高亮: });P