javascript - Loading json File in a HTML file - Stack Overflow

admin管理员组

文章数量:1400533

I have a JSON file which contains HTML content. I want to load it in my main HTML file when a user clicks on a button.

ABC.json contains:

<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>

The Javascript code that I'm using is:

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

Unfortunately, it doesn't work.

I have a JSON file which contains HTML content. I want to load it in my main HTML file when a user clicks on a button.

ABC.json contains:

<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>

The Javascript code that I'm using is:

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

Unfortunately, it doesn't work.

• javascript
• html
• json

Share Improve this question Follow edited Apr 3, 2013 at 6:39 Yasir Arsanukayev 9,68622 gold badges4242 silver badges6262 bronze badges asked Jun 16, 2012 at 14:29 SoarabhSoarabh 2,96099 gold badges4141 silver badges5757 bronze badges 2

• 3 if it contains just HTMLthen why dont you make it .html? – Furqan Hameedi Commented Jun 16, 2012 at 14:31
• 7 your json file is not json _ – Ram Commented Jun 16, 2012 at 14:32

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 5

The file ABC.json does not contain any valid JSON.

I think it's worthwhile visiting http://www.json/ You will get a better idea about json and how to use it.

Specifically you will find the way to pass html within json in different languages

Please edit your code:

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);
    });
});

Your .json file contains pure html and not JSON. Why not use .html or .txt instead?

Or you can try this:

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

本文标签： javascriptLoading json File in a HTML fileStack Overflow