標籤：fun append jquer doc 點擊 title log each logs
html代碼：
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>擷取JSON</title> <script type="text/javascript" src="jquery-3.2.1.js"></script></head><body> <div class="myDiv" style="color:aliceblue"></div> <button class="btn">擷取資料</button> <script type="text/javascript"> $(function(){ $(".btn").click(function(){ $(".myDiv").empty();//每次點擊按鈕清空原來資料，防止無限載入。 $.ajax({ url:"data.txt", datatype:"json", type:"GET", success:function(data){ $.each($.parseJSON(data),function(n,item){ //.parseJSON（）方法把JSON字串轉換為javascript對象，不轉換的話將會拋出錯誤。 $(".myDiv").append("<p>key:"+item.optionKey+"</br>value:"+item.optionValue+"</p>");//控制輸出的資料格式 }) } }) }) }) </script></body></html>
json部分：
[ {"optionKey":"1", "optionValue":"Canon in D"}, {"optionKey":"2", "optionValue":"Wind Song"}, {"optionKey":"3", "optionValue":"Wings"} ]
jquery實現JSON資料擷取
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
