从json对象创建定义列表

时间:2012-04-19 19:41:26

标签: javascript json list structure

我尝试创建一个工作的json-object结构来创建一个defintion列表。 看看我在这里尝试做什么: jsfiddle

var x =
[{
    "dl":
    {
        "dt":"head 1"
        {
            "dd":
            [
                "listitem 1",
                "listitem 1",
                "listitem 1",
                "listitem 1",
                "listitem 1"
            ]
        },
       "dt":"head 2"
        {
            "dd":
            [
                "listitem 2",
                "listitem 2"
            ]
        }
    }      
}]
;

通过执行JS的这个片段,我尝试从JSON对象创建markupt:

$.each(x["dl"], function(i,v){
    console.log(this.dt, this.dd);
});

使用变量x我尝试创建以下标记:

<dl>
    <dt>head 1</dt>
    <dd>listitem 1</dd>
    <dd>listitem 1</dd>
    <dd>listitem 1</dd>
    <dd>listitem 1</dd>
    <dd>listitem 1</dd>

    <dt>head 2</dt>
    <dd>listitem 2</dd>
    <dd>listitem 2</dd>   
</dl>

<dl>
    <dt>head 1</dt>
    <dd>listitem 1</dd>
    <dd>listitem 1</dd>
    <dd>listitem 1</dd>
    <dd>listitem 1</dd>
    <dd>listitem 1</dd>

    <dt>head 2</dt>
    <dd>listitem 2</dd>
    <dd>listitem 2</dd>   
</dl>

标记是我需要创建的。我的JSON结构出了什么问题?

1 个答案:

答案 0 :(得分:3)

首先,这是不是 JSON。这只是一个JavaScript对象。 JSON是JavaScript对象的字符串表示

其次,你的对象不正确。您不能拥有多个dt属性,我建议将其设为数组。 "dt":"head 1" {无效。此外,x应该是一个对象,而不是一个(对象的)数组。

我建议像这样制作你的对象:

var x = {
    "dl": [{
        "dt": "head 1",
        "dd": ["listitem 1", "listitem 1", "listitem 1", "listitem 1", "listitem 1"]
    }, {
        "dt": "head 2",
        "dd": ["listitem 2", "listitem 2"]
    }]
};

x是一个包含dl属性的对象。 x.dl是一个包含对象的数组。这些对象包含dtdd属性。

现在,您的代码段将正常运行:

$.each(x["dl"], function(i,v){ // you can also use "x.dl"
    console.log(this.dt, this.dd);
});

通过这个对象,您可以轻松制作所需的HTML。