2011-06-18 13 views
0

am JSONオブジェクトから動的にjavascriptを使用して順序付けられていないリストを作成しています。javascriptを使用して動的にリストにアンカーを追加する際の問題

function renderList(branches) { 
    var ul = document.createElement("ul"); 
    for (var i=0, n=branches.length; i<n; i++) { 
     var branch = branches[i]; 
     var li = document.createElement("li"); 
       var text = document.createTextNode(branch.name); 
       li.appendChild(text); 
     if (branch.branches) { 
      li.appendChild(renderList(branch.branches)); 
     } 
     ul.appendChild(li); 
    }  
    return ul; 
} 

function renderTree() 
    { 
    var treeRoot = document.getElementById("tree"); 
    var treeObj = {"root": 
      [{ 
        "name": "File", 
        "branches":[ 
       {"name": "New"}, 
          {"name": "Save"}, 
          {"name": "Exit"} 
           ] 
       }] 
      }; 
    treeRoot.appendChild(renderList(treeObj.root)); 
} 

動的リストにアンカーを追加するために、JSON & JavaScriptで必要な変更は何ですか? <li> File </li>から<li> <a href="yahoo.com"> File </a> <li>

答えて

2

に動的に

アンカーノードとラインli.appendChild(text);textを置き換えます

あなたのURLが保存されている
function renderList(branches) { 
    var ul = document.createElement("ul"); 
    for (var i=0, n=branches.length; i<n; i++) { 
     var branch = branches[i]; 
     var li = document.createElement("li"); 
     var text = document.createTextNode(branch.name); 

     // new code here 
     var a = document.createElement("a"); 
     a.setAttribute('href', 'http://yahoo.com') 
     a.appendChild(text); 
     // 

     li.appendChild(a); 
     ... 

? (上記のコードを更新して、ハードコードされたURLを実際の値に置き換えることができます。

関連する問題