for循環中for循環的JS函數破解

Question

該腳本的目的是動態創建元素的克隆，然後用包含在JS對象中的數據填充克隆。我的目標是從服務器返回已解析的JSON，並調用此函數來克隆DOM中的元素，並使用來自服務器的數據填充這些克隆。我想這樣做的原因是爲了完全消除動態創建從明確寫入JS字符串html元素，如：

var HTMLelementAsJSstring = "<article></article>"; 

我想這些元素通過讀取對象（eTreeObj）被動態地創建包含元素與解析的JSON（作爲JS對象）屬性的關係。

這裏是我的JS（使用jQuery）

var jso = { 
"Result": [ 
    { 
     "Title": "HQWE", 
     "Details": "sdfsdf" 
    }, 
    { 
     "Title": "WQasdaE", 
     "Details": "asdadas" 
    } 
    ] 
}; 


function dynECreatefromJSO(Oproperty, parentE, childE, eTree) { 
    for (i = 0; i <= Oproperty.length; i++) { 

     if (i != 0) { 
      var TargetE = Eclone.appendTo(parentE); 
     } else { 
      var TargetE = $(childE), 
       Eclone = TargetE.clone(); 
     } 

     for (q = 0; q <= eTree.length; q++) { 
      TargetE.children(eTree[q].Element).html(Oproperty[i][eTree[q].JSOproperty]); 
     } 
     alert("DOESN'T REACH HERE"); 

    } 
} 

var eTreeObj = [ { 
     "Element": "header", 
     "JSOproperty": "Title" 
     }, 
     { 
     "Element": "article", 
     "JSOproperty": "Details" 
     } 
    ]; 

dynECreatefromJSO(jso.Result, "div#main", "section.thiselement", eTreeObj);​ 

而我的HTML：

<div id="main"></div> 

<section class="thiselement"> 
    <header></header> 
    <article></article> 
</section>​ 

，當我訪問屬性eTree對象中的在for循環中我遇到的問題時我的增量變量是「q」。該函數中斷，並且不能再次使用增量變量「i」運行循環。

如果我刪除此for循環內的操作，一切工作正常。我想不通這是爲什麼：

http://jsfiddle.net/KKv22/2/

Answer 1

你必須改變你的循環這樣，

for (i = 0; i < Oproperty.length; i++) { 

    if (i != 0) { 
     var TargetE = Eclone.appendTo(parentE); 
    } else { 
     var TargetE = $(childE), 
      Eclone = TargetE.clone(); 
    } 

    for (q = 0; q < eTree.length; q++) { 
     TargetE.children(eTree[q].Element).html(Oproperty[i][eTree[q].JSOproperty]); 
    } 
    alert("DOESN'T REACH HERE"); 

} 

這是因爲數組索引從0開始（零）因此，它將只包含長度爲1的索引。