Speed up development with full-stack environments for every branch.

Learn More

How to Parse a JSON file using jQuery

Forked from How to use the jQuery UI Slider.

33786 Runs 251253 Views 122733 Copies


pg1 45

published 4 years ago

<!doctype html>

    <title>How to Parse a JSON file using jQuery</title>
            text-align: center;
            font-family: arial;

            font-weight: bold;
            padding:5px 10px;

    <a href="data.json" target="_blank">Open JSON file</a><br />
    <input type="button" value="Get and parse JSON" class="button" />
    <br />
    <span id="results"></span>

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>


        //When DOM loaded we attach click event to button
        $(document).ready(function() {
            //after button is clicked we download the data

                //start ajax request
                    url: "data.json",
                    //force to handle it as text
                    dataType: "text",
                    success: function(data) {
                        //data downloaded so we call parseJSON function 
                        //and pass downloaded data
                        var json = $.parseJSON(data);
                        //now json variable contains data in json format
                        //let's display a few items
                        $('#results').html('Plugin name: ' + json.name + '<br />Author: ' + json.author.name);

Please login/signup to get access to the terminal.

Your session has timed out.

Dismiss (the page may not function properly).