javascript - 在 HTML 文件中加载 json 文件

Question

我有一个包含 HTML 内容的 JSON 文件。当用户单击按钮时，我想将它加载到我的主 HTML 文件中。

ABC.json包含：

<li><img src="images/picture6.jpg" /></li>
<li><img src="images/picture5.jpg" /></li>
<li><img src="images/picture4.jpg" /></li>
<li><img src="images/picture3.jpg" /></li>
<li><img src="images/picture2.jpg" /></li>
<li><img src="images/picture1.jpg" /></li>

我正在使用的 Javascript 代码是：

$("button").click(function(){
    $.getJSON("javascript/lib/domain.json", function(data){
        console.log(data);
    });
});

不幸的是，它不起作用。

Answer 1

该文件ABC.json不包含任何有效的 JSON。

我认为值得访问http://www.json.org/你会更好地了解 json 以及如何使用它。

具体来说，您会找到在不同语言的 json 中传递 html 的方法

Answer 2

请编辑您的代码：

abc.json

"img": [
        {"src": "images/picture6.jpg"},
        {"src": "images/picture5.jpg"},
        {"src": "images/picture4.jpg"},
        {"src": "images/picture3.jpg"},
        {"src": "images/picture2.jpg"},
        {"src": "images/picture1.jpg"},
       ]

Javascript

$("button").click(function(){
    $.getJSON("javascript/lib/abc.json", function(data){
        console.log(data);
    });
});

Answer 3

您的 .json 文件包含纯 html 而不是 JSON。为什么不使用.html或.txt代替？

或者你可以试试这个：

var my_html = $.parseJSON(data);
console.log(my_html);