JS的 for in 循环遍历DOM节点时的巨坑 , 循环体自带异常的处理和思考

今天踩了个坑 :

• 在JS中用for(i in arr)去遍历DOM节点时,循环体内自带异常;
• 分明数组长度是正确的,可遍历的次数>数组长度);
• 补充说明 : 仅对节点,进行了读取操作;
• 直接影响 , JS后续代码停止执行

解决方案 : try.catch掉,或者用普通for循环;

部分代码如下:

function itemTotal(){ // 订单项合计
	var items = document.getElementsByClassName("checkbox");	
	var priceTotal = 0; // 合计金额
	var numTotal = 0; // 合计数量

	alert("数组长度是 : "+items.length); // 2 没错	
	var index = 0; // 循环次数;
	for(i in items){ // 循环体自带异常 ;
		index++;
		
		try{
			numTotal += parseInt(items[i].parentNode.parentNode.children[4].children[1].value);
			priceTotal += parseInt(items[i].parentNode.parentNode.children[5].children[0].innerHTML);
			alert("叠加后金额为:"+priceTotal +"| 数量为:" + numTotal);
		}catch(err){
			alert("出错啦(截获不处理)!当前第几个元素出错:"+index); // 三次报错,分别为 :3.4.5
			alert(err.message); // items[i].parentNode is undefined --> items里最后还附带了其他元素,导致出错!
		}
	}
	
	alert("运行结束!");
	alert("叠加后金额为:"+priceTotal +"| 数量为:" + numTotal);

问题根源 : for in 遍历 , 会将item的子级属性也给遍历出来;

另一种解决方法思路 :

vararray = ["admin","manager","db"];
Array.prototype.name= "zhangshan";
     for(var i in array){
//如果不是该对象自身直接创建的属性，则跳过遍历;
         if(!array.hasOwnProperty(i)){
              continue;
          }
          alert(array[i]);
	}