<ul></ul>

Question

1. 私はjavascriptオブジェクトとjqueryでメニューを作成します。 <ul></ul>に入る必要のあるアイテムがありますが、その下にあるアイテムです。

   http://jsfiddle.net/MWBt6/

2. 私は、例えば 'インデックス' を持っています。そこに私は項目のリストを追加したいと思います。

   私はカテゴリIDが0でアイテムIDが2であることを知っています。私はそれらのものをデータ属性に保存しました。

ここでulを追加するにはどうすればよいですか？

Answer 1

これは、appendの動作ではありません。独自の要素を作成する必要があります。ここで：

var loadPath = "resources/books/book1/"; 

var menu = { 
    data: [{ 
     name: "the book", 
     id: 0, 
     items: [{ 
      name: "Introduction", 
      id: 0, 
      target: "inleiding.html" 
     }, { 
      name: "Content", 
      id: 1 
     }, { 
      name: "Index", 
      id: 2 
     }] 
    }, { 
     name: "my stuff", 
     id: 1, 
     items: [{ 
      name: "Notes", 
      id: 0 
     }, { 
      name: "Marks", 
      id: 1 
     }] 
    }, { 
     name: "other", 
     id: 2, 
     items: [{ 
      name: "Search", 
      id: 0 
     }, { 
      name: "Continue Reading", 
      id: 1 
     }] 
    }] 
} 

$(document).ready(function() { 
    var $menu = $('#menu'); 

    for(var i = 0; i < menu.data.length; i++) { 
     var categorie = menu.data[i]; 
     var categorieName = categorie.name; 
     var categorieId = categorie.id; 
     var items = categorie.items; 

     console.log("categorieName: " + categorieName); 

     var list = $('<ul>'); 

     for(var j = 0; j < items.length; j++) { 
      var itemId = items[j].id; 
      list.append($('<li>').attr('data-itemId', itemId).text(items[j].name)); 
     } 

     $menu.append(
      $('<li>').attr('data-categorieId', categorieId).append(categorieName, list) 
     ); 
    } 
});​ 

Here's the updated jsFiddle.

Answer 2

あなたは、DOMは、テキストエディタであるかのように追加しようとしています。要素の開始タグを付けることはできません。その後、その要素を終了タグの付いた要素で閉じます。完全な有効な要素のみをDOMに挿入できます。

代わりに、html文字列を作成して、文字列が完成した後に1つだけ追加します。このメソッドは、はるかに効率的な複数を行うよりも、デモの作業も

を追加：あなたは `.append（categorieName、リスト）`なぜ最初のパラメータを説明することができhttp://jsfiddle.net/MWBt6/3/