JSONデータからHTMLの箇条書きリストを作成する際の問題

Question

箇条書きのリストに入れたいJSONがあります。各レベルには、名前フィールドと子供フィールドがあります（最低レベルからは離れています）。私はそれを行うために再帰を使用しようとしましたが、私は問題に取り組んできました。最後のレベルを除いて、最初の子のみが表示されます。私の再帰呼び出しのいくつかが正しく返ってこないかもしれないという気持ちがあります。ここで私が持っているコードは、これまでのところです：

function load_menu(){ 
    json_text=ajax_get("example.json"); 
    json_tree=JSON.parse(json_text); 
    write_menu(json_tree.children,document.getElementById("level1")); 
} 
function write_menu(json,element){ 
    for(i=0;i<json.length;i++){ 
     var listitem=document.createElement("li"); 
     element.appendChild(listitem); 
     var listitemtext=document.createElement("span"); 
     listitem.appendChild(listitemtext); 
     listitemtext.innerText=json[i].name; 
     if(json[i].children){ 
      listitemtext.setAttribute("onclick","toggle(this);"); 
      var sublist=document.createElement("ul"); 
      listitem.appendChild(sublist); 
      write_menu(json[i].children,sublist); 
     }; 
    }; 
} 

私はこのようになります木で終わる：

Level 1,1 
    Level 2,1 
     Level 3,1 
     Level 3,2 

それは次のようになります。

Level 1,1 
    Level 2,1 
     Level 3,1 
     Level 3,2 
    Level 2,2 
Level 1,2 
    Level 2,3 

私がチェックしています私のJSONを介してそれはOKだと思うので、どこかで再帰に問題があるはずです。誰でもここで私を助けることができますか？

Answer 1

for (i...と書くと、JSインタープリタは新しい変数iが存在しない場合はそれを作成し、存在する場合は既存のものを再利用します。これは問題です。再帰のすべてのレベルで新しいループ変数が必要なためです。

解決策は、代わりにfor (var i...と記述して、すべてのレベルで変数を強制的に作成することです。