JavaScript 在循环时更改 for 循环条件（无 JQuery）答案

【问题标题】：JavaScript change for-loop condition while looping (No JQuery)JavaScript 在循环时更改 for 循环条件（无 JQuery）
【发布时间】：2016-01-28 12:46:57
【问题描述】：

我有一个看起来有点像这样的代码。

如果检查的 div 有子 div，我想要实现的是更改 for 循环代码。

var condition = divs.querySelectorAll('div');
for(i = 0; i < condition.length; i++){
    if(condition[i].querySelectorAll('div').length > 0){
         condition = condition[i].querySelectorAll('div');
         i = 0;
    }else{
         // Last div reached.
         break;
    }
}

有没有人知道如何实现这种效果。我必须使用其他类型的循环吗？

编辑：

由于似乎我错了代码错误，我现在发布我凌乱的代码：

var posX = e.clientX;
var posY = e.clientY;
function mouseDown(e){
    var getChildDivs = this.querySelectorAll('div');

    if(getChildDivs.length > 0){
        var offsetDivLeft = 0;
        var offsetDivTop = 0;
        for(i = 0; i < getChildDivs.length; i++){
            if(posX >= getChildDivs[i].offsetLeft && posX <= getChildDivs[i].offsetLeft + Math.floor(getChildDivs[i].style.width.slice(0, -2)) &&
                posY >= getChildDivs[i].offsetTop && posY <= getChildDivs[i].offsetTop + Math.floor(getChildDivs[i].style.height.slice(0, -2))){
                if(getChildDivs[i].querySelectorAll('div').length > 0){
                    offsetDivLeft = offsetDivLeft + getChildDivs[i].offsetLeft;
                    offsetDivTop = offsetDivTop + getChildDivs[i].offsetTop;
                    getChildDivs = getChildDivs[i].querySelectorAll('div');
                    curDiv = getChildDivs[i];
                    i = 0;
                }else{
                    curDiv = getChildDivs[i];
                    break;
                }
            }
        }
}
}

【问题讨论】：

目前的结果是什么？你的代码应该没问题，condition.length 将有子 div 长度，只有 i 应该是 -1，因为它会在循环完成时递增，从 0 开始。
赞成明确拒绝 jquery。荣誉
所以你想递归循环遍历所有的孩子？您是否还想循环遍历子项的子项？
似乎是 XY 问题。 event.target 没有给你追捧的元素吗？
对我来说似乎很 XY，是的。您不必执行此类操作来确定触发 mousedown 的元素。

标签： javascript for-loop conditional-statements

【解决方案1】：

正确的解决办法是

function mouseDown(e){
  curdiv = e.target;
}

事件的target 属性为您提供了被点击的实际div——通常是最前面的，通常也是嵌套最深的。来自MDN：

对调度事件的对象的引用。

【讨论】：

是的，这就是问题所在，出于某种原因，我希望它让自己变得更难，将其标记为已接受的答案，因为这是我想要达到的目标。

【解决方案2】：

我创建了一个循环遍历每个子元素和子元素的小提琴：

http://jsfiddle.net/czzeaz3x/

var condition = divs.querySelectorAll('div');
for(i = 0; i < condition.length; i++){
if(condition[i].children.length > 0){
     condition = condition[i].querySelectorAll('div');
    alert(condition);
     i = 0;
}else{
     // Last div reached.
     break;
}
}

希望对你有帮助；）

【讨论】：