本篇案例與之前javascript一樣的功能，按下按鈕將遠端json資料呈現在網頁上。
只不過是用jquery來寫，在此用兩種寫法呈現：

1. 顯示是否有抓到資料
2. 顯示json資料在網頁上

html：

功能是按下按鈕下方就會顯示遠端抓取的文字

<button class="btn">遊樂園資訊</button> //按下按鈕顯示下方內容
<ul class="info">
// json資料轉成li顯示於此
</ul>

jquery：

1.顯示是否有抓到資料(success、error)

設定成功就在按鈕下方顯示「抓到資料囉!」
若失敗則跳出警告視窗「請再確認程式!!」

ajax()抓取資料的方法：

w3c：http://www.w3school.com.cn/jquery/ajax_ajax.asp

$.ajax([settings])
//或是下方寫法
$.ajax(url[, settings])

網友整理的ajax()
https://dotblogs.com.tw/jasonyah/2013/06/02/use-ajax-you-need-to-be-care

$.ajax({
    url: '',                        // url位置
    type: 'post',                   // post/get
    data: { querytag: data },       // 輸入的資料
    error: function (xhr) { },      // 錯誤後執行的函數
    success: function (response) { }// 成功後要執行的函數
});

依照上面ajax()寫法，想要呈現是否有抓到資料(成功/失敗)，如下方語法所示：

$.ajax({
url:'https://ruienyuski.github.io/git_test/data.json',
success:function(response){$('.info').html('抓到資料囉!');},
error:function(xhr){alert("發生錯誤: " + xhr.status + " " + xhr.statusText);}
 });
 //w3c：如何使用錯誤設置來應對一個AJAX請求錯誤。
 //https://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_ajax_ajax_error

結果如下圖：

2.顯示json資料在網頁上

當成功載入資料時，就寫把遠端資料用append()插入在ul標籤內，變成 ul li清單列，
下方用$.each來遍歷(循環訪問)，達到串接成 「li」+「標題」+「陣列文字」的一組li資料

$.each用法可看原文官網會比較清楚
http://api.jquery.com/jQuery.each/
網友整理$.each的用法
https://lingmissing.github.io/myBlog/2016/05/19/each-use/

success: function (response) { 
$.each(response, function(index, element){ //$.each成功後執行的函數(respnose)
//index,element兩者都可隨意命名，index:選擇器的index位置，element；當前的元素
  }
}

串接語法參考來源：
https://stackoverflow.com/questions/8951810/how-to-parse-json-data-with-jquery-javascript

$('<li>',{text: [index+1]+'.'+'名稱：'+element.place})

結果如下：

    success: function (response) { 
        $.each(response, function(index, element) {
            $('.info').append(
                    $('<li>', 
                    {text: [index+1]+'.'+'名稱：'+element.place}),
                    $('<li>',
                    {text: [index+1]+'.'+'地址：'+element.address}),
                    $('<p>')
                    );
        });
    }

最後只要加入button按下的事件就完成了!!

codepen網址：https://codepen.io/yuski/pen/NXxbQo