0

次のような配列を取得しました。

var myArray = {
    "ABC.txt": "1",
    "AD.txt": "2",
    "uploads/": "1",
    "uploads/Penguins.jpg": "1",
    "uploads/Tulips.jpg": "2",
    "morefiles.txt": "2"
};

私はul li次のようにそれを作ろうとしています：

<ul>
  <li>
    <a href="ABC.txt" pos="1">ABC.txt</a>
  </li>
  <li>
    <a href="AD.txt" pos="2">AD.txt</a>
  </li>
  <li rel="folder">
    <a href="uploads/" pos="1">uploads</a>
    <ul>
      <li>
        <a href="uploads/Penguins.jpg" pos="1">Penguins.jpg</a>
      </li>
      <li>
        <a href="uploads/Tulips.jpg" pos="2">Tulips.jpg</a>
      </li>
    </ul>
  </li>
  <li>
    <a href="morefiles.txt" pos="2">morefiles.txt</a>
  </li>
</ul>

私はUL LIjQueryを使用しようとしていますが、ここに置く価値さえないコードのスクラップだけを思いつきました。

少し助けてください。

4

2 に答える 2

1

必要なのはある種のテンプレートエンジンのようです。ICanHazを確認してください。次のようなものがあります。

<script id="user" type="text/html">
  <li>
    <p class="name">Hello I'm {{ name }}</p>
    <p><a href="http://twitter.com/{{ twitter }}">@{{ twitter }}</a></p>
  </li>
</script>

初期化スクリプトは次のように単純です。

var user = ich.user(user_data_object)

また、この記事「クライアント側のテンプレート化」では、次のことについて説明します。

<h1>{{title}}</h1>
<ul>
    {{#names}}
        <li>{{name}}</li>
    {{/names}}
</ul>

これに加えて：

var data = {
    "title": "Story",
    "names": [
        {"name": "Tarzan"},
        {"name": "Jane"}
    ]
}

これに変換するには：

<h1>Story</h1>
<ul>
    <li>Tarzan</li>
    <li>Jane</ul>
</ul>
于 2013-03-10T17:27:33.910 に答える
0

まず、変数 myArray は配列ではなく、[ ] 内で配列が定義されているため、次のようになります。

var myArray = [{"ABC.txt" : "1"}, {"AD.txt" : "2"}, {"uploads/" : "1"}, {"uploads/Penguins.jpg" : "1"}, {"uploads/Tulips.jpg" : "2"},{"morefiles.txt" : "2"}];

しかし、あなたの質問でhtmlを生成するには、おそらく次の構造の方が良いでしょう:

var myArray = [
    {
        "href":"ABC.txt",
        "pos" : "1"
    },{
        "href":"AD.txt",
        "pos":"2"
    },
    ...etc
];

次に、別の内部配列を使用して、ネストされた

次に、for ループを使用して配列を反復処理し、要素を追加します。

于 2013-03-10T17:37:23.193 に答える