0

我正在使用包含大量 HTML 值的 JSON。下面是 JSON 的简化版本，可帮助您进行可视化：

{
"header" : "<a class='widget'>widget</a>
            <a class='widget'>widget</a>
            <ul class='header'>
                 <li>link1</li>
                 <li>link2</li>
                 <li>link3</li>
            </ul>"
            <a class='random'>random link</a>
            <a class='random'>random link</a>,

"footer" : "<a class='social'>social</a>
            <a class='social'>social</a>
            <ul class='footer'>
                 <li>link1</li>
                 <li>link2</li>
                 <li>link3</li>
            </ul>"
 }

我无法找到加载 JSON、提取“ul.header”并将其注入 div 的方法（使用 jQuery）：

<div class="giveMeHeaderList"></div>

最终结果应如下所示：

<div class="giveMeHeaderLinks">
    <ul class='header'>
        <li>link1</li>
        <li>link2</li>
        <li>link3</li>
    </ul>
</div>

（如果 JSON 格式不正确，我深表歉意，因为我快速输入它并且仅将其用于显示目的）

谢谢您的帮助！

4

3 回答 3

0

最好的解决方案是：

$.post("url/", {},
        function (data/*({header: "<ul>...</ul>"})*/, textStatus) {
          $("#giveMeHeaderLinks").html(data.header)
        }, 
"json");

但是，您只需要注入部分标头值，试试这个；

$.post("url/", {},
        function (data, textStatus) {
          $("#giveMeHeaderLinks").append($("<div>"+data.header+"</div>").find("ul.header"));
        }, 
"json");
于 2013-10-23T06:37:45.230 回答
0

假设你有这个 JSON：

htmltext = {"header": "<span><ul><a class='widget'>widget</a></ul></span>", "footer":"<a class='foot'>footer</a>"}

并且您有以下 html 代码：

<head>
    <script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
</head>

<body>
    <div class="giveMeHeaderList">test</div>
</body>

运行以下 JS 将产生你想要的：

$(".giveMeHeaderList").append($(htmltext.header).find('ul'));

使用 jQuery .find 查找<ul>html 中的元素并将其附加到相关的 .

htmltext 是您的 JSON 所在的位置，并且header是相关的 JSON 元素

于 2013-10-23T06:26:37.113 回答
0

这将做到：

演示

var obj = JSON.parse(json);

$('.giveMeHeaderList').append($('<div>' + obj.header + '</div>').find('ul.header'));
于 2013-10-23T06:27:50.623 回答