HTML references external json file

I was in hubuilder in the trial, the first new data.json file. Written inside the content. Wherein var dataFromJSON for ease of reference.

var dataFromJSON = {
                "text":"外部json",
                "iconCls":"fa fa-wpforms",
                "state":"open",
                "children":[{
                    "section_id":1,
                    "text":"第一节”
                },{
                    "text":"第二节"
                    }]
                }

Add the following references to the page, and they can use dataFromJSON data on this page,

<script type="text/javascript" src="data/data.json"></script>

console.log(dataFromJSON)

But in the idea in the new json file, not this way, not to json file data definition name, so be replaced with ajax, pay attention to this is json, will be added in front of the number of elements in the array, as a key value, which will deal with some trouble.

.ajax $ ({ 
    of the type: "GET", // use the get request requesting the correct 
    url: "data..json", 
    dataType: "json", 
    // the Data: 
    Success: function (the Data) { 
        console.log ( "the Data : "+ the JSON.stringify (Data [0])) 
    }, 
    error: function () { 
        Alert (" request failed ") 
    } 
})