javascript - JSON : JSON 要素項目を別の場所に配置する方法

Question

counthref のように配置する簡単な方法はありますか

このように期待する結果 <li><a id="{ID}" class="item" href="#">London</a>(25)</li>

デモ http://jsfiddle.net/aKEDJ/15/

どんなアドバイスも大歓迎です

Answer 1

個人的には、HTML のフォーマットを少し簡単にするために、以下に記載しているものよりもさらに大きな関数の書き直しを行います。

以下の関数で使用されているすべての変数はvard であり、できるだけ多くのロジックをループの外に移動しました。これにより、（うまくいけば）フォローしやすくなります。

function insertData(NinCol, Colcount) {
    var ul_format = "<ul id=\"{ID}\">{DATA} </ul>", // format of <ul>
        li_format = "<li> <a href='#' class=\"item\" id=\"{ID}\">{NAME}</a>({COUNT})</li>", // format of <li>
        re = /({ID})|({NAME})|({COUNT})/g, // single regex for formatting
        re_function = function (id, name, count) { // generate replace function
            return function (m, mid, mname, mcount) { // replace found item
                return (mid && id) || (mname && name) || (mcount && count) || '';
            };
        },
        html_str = "", i;
    for (i = lastIndex; i < lastIndex + NinCol; ++i) {
        html_str += li_format.replace( // apply all formatting
            re,
            re_function(i, jsonStr[i].name, jsonStr[i].count)
        );
    }
    html_str = ul_format
        .replace(/{ID}/, Colcount)       // give <ul> it's id
        .replace(/{DATA}/, html_str);    // and add all <li>s
    $('#destinations').append(html_str); // then append
    lastIndex += NinCol;
}

ここでフィドルを更新しました。
別の別の書き方reは、/{(?:(ID)|(NAME)|(COUNT))}/g

また、そのままのコードでは一意ではないidが生成される可能性があり、HTML が無効になる可能性があることも考慮する必要があります。