Articles → JSON → Read JSON data using jQuery

Read JSON data using jQuery

Software requirement

Prerequisite knowledge

Steps of execution

Create a new HTML file and add span tags in it

    <h2>Reading student information from json data</h2>
    Name: <span id="nameperson"></span>
    <br />
    Age: <span id="ageperson"></span>
    <br />
    Technology: <span id="technologyspan"></span>
    <br />
    Address: <span id="addressspan"></span>
    <br />

Add JavaScript code to access JSON

<script src="jquery-1.7.2.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            var Trainer =
                    "Name": "Karan Gupta",
                    "Age": 28,
                    "Technology": "JSON",
                            "City": "Gurgaon",
                            "State": "Haryana"
            document.getElementById("nameperson").innerHTML = Trainer.Name;
            document.getElementById("ageperson").innerHTML = Trainer.Age;
            document.getElementById("technologyspan").innerHTML = Trainer.Technology;
            document.getElementById("addressspan").innerHTML = Trainer.Address.City;



Click to Enlarge

Posted By  -  Karan Gupta
Posted On  -  Sunday, September 15, 2013


Your Email Id  
Query/FeedbackCharacters remaining 250