Tuesday, 15 August 2017

Get JSON Data in HTML with jQuery And Use Third Party API - W3tricks

Get JSON Data in HTML with jQuery And Use Third Party API



  • Use jquery simple to get JSON Data in the Third party API. 
  • ' $get.JSON ' method is use to get JSON data using an AJAX, HTTP, HTTPS and GET request.


Index.html


<html>
    <head>
   <title>W3tricks</title>
    </head>
<body bgcolor="#000">
<div id="output" style="color:#fff;"></div>
<br/><p>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="script.js"></script>
</body>
</html>


Script.js


$(document).ready(function(e) {
var con = "<h1>All Name List</h1>";
    $.getJSON("https://jsonplaceholder.typicode.com/posts/1/comments",function(data){

for(var x in data){
      con +=  (parseInt(x) + 1)+ '&nbsp;' + data[x].name + "<br/>";
                }
$('#output').html(con);
       })
});


Output - 1



Simple - Output - 2


0 comments:

Post a Comment