标签：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"}
]
标签：fun append jquer doc 点击 title log each logs
原文地址：http://www.cnblogs.com/yzhweb/p/7471997.html
