Question

我从互联网上的某个地方获得此代码，但我不太明白。特别是for循环部分。

function FindPosition(oElement) {
  if( typeof( oElement.offsetParent ) != "undefined" ) {
    for( var posX = 0, posY = 0; oElement; oElement = oElement.offsetParent ) {
      posX += oElement.offsetLeft;
      posY += oElement.offsetTop;
    }
    return [ posX, posY ];
  }
  else {
    return [ oElement.x, oElement.y ];
  }
}

我不明白这里的for循环部分：

for( var posX = 0, posY = 0; oElement; oElement = oElement.offsetParent )

我希望有一个中间表达式或上限而不只是oElement

请有人向我解释一下吗？

Answer 1

for循环头有3个部分：初始化，条件，迭代。

这里，条件（...; oElement; ...）不是与上限（例如i < 100）的比较形式。相反，它检查oElement是否为真（即非空，未定义，不为0）

迭代部分（...; oElement = oElement.offsetParent）不会像您习惯的那样增加任何索引值（例如i++）。相反，它通过将oElement的父级分配给oElement而在元素层次结构中向上移动。

当不再定义offsetParent时，条件确保向上遍历停止。

Answer 2

这只是使用for-loop代替do-while的示例。如果你使用do-while重写它，那么循环背后的整体想法应该是清楚的。

function FindPosition(oElement) {
  if( typeof( oElement.offsetParent ) != "undefined" ) {
    var posX = 0, posY = 0;
    do {
      // update coordinates using offset data
      posX += oElement.offsetLeft; 
      posY += oElement.offsetTop;

      // move up the DOM tree
      oElement = oElement.offsetParent

    } while(oElement != null) // while there is offsetParent

    return [ posX, posY ];
  }
  else {
    return [ oElement.x, oElement.y ];
  }
}

解释复杂的javascript for循环

2 个答案: