Converting json data to html

Question

I'm trying to convert json data from a website and display it in html:

var obj = 'http://ip-api.com/json';
document.getElementById('info').innerHTML = obj.country + ", " + obj.as;

I am trying to get the JSON code from a url called http://ip-api.com/json, and I am trying to get the data to be read and then shown into html, can anyone help?

This is probably the most basic thing that any JS program ever does. There are about 101 ways to approach it, all of them covered in hundreds and thousands of intros, tutorials, and blog posts. — user663031
– user663031, Commented Oct 13, 2017 at 13:27

Eduardo Escobar · Accepted Answer · 2017-09-22 19:57:58Z

-1

You will need to perform an Ajax call to fetch the remote the json. I suggest you to use jQuery library for this.

Before </body>:

<script type="text/javascript" src="//code.jquery.com/jquery-1.12.4.min.js"></script>
<script type="text/javascript">
  jQuery.getJSON("http://ip-api.com/json", function(obj) { 
    jQuery("#info").html(obj.country + ", " + obj.as); 
  });
</script>

answered Sep 22, 2017 at 19:57

Eduardo Escobar

3,4192 gold badges20 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

11 Comments

Roto Over a year ago

The information on the website didnt display on the html doc?

Eduardo Escobar Over a year ago

Are you running this html in your local machine? If so, replace src="//code.jquery.com/jquery-1.12.4.min.js" by src="http://code.jquery.com/jquery-1.12.4.min.js"

Roto Over a year ago

I am running it off a local machine and what am I doing wrong because the JSON data wont display on the html <html> <body> <script type="text/javascript" src="code.jquery.com/jquery-1.12.4.min.js"></script> <script type="text/javascript"> jQuery.getJSON("ip-api.com/json", function(obj) { jQuery("#info").html(obj.country + ", " + obj.as); }); </script> </body> </html>

Eduardo Escobar Over a year ago

And where is #info HTML container??

Roto Over a year ago

I'm clearly not to experienced with html, but I get the concept and I am working on it, but I don't really understand what you mean by HTML container

|

Collectives™ on Stack Overflow

Converting json data to html

1 Answer 1

11 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

11 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related