利用JQuery获取本地JSON文件

直接贴代码吧（代码是复制菜鸟教程的 getJSON() 方法，只是加上本人的测试和注释）：

 

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>  // 这个是在线的 JQuery JS
<script>
  $(document).ready(function () { // 初始化方法
    $("button").click(function () { // Button 按钮调用此方法
/**
    用 getJSON () 方法获取本地JSON文件，我是直接在项目目录下创建了 json 文件，把 data.json 文件放进去
    getJson() 方法会把获取到的数据全部传到 result 参数，利用 each 循环或者其他方法进行输出
    （在这里我直接把获取的数据追加到 span 标签）
*/
      $.getJSON("json/data.json", function (result) { 
        $.each(result, function (i, field) {
          $("span").append(field.name + "," + field.goods);
        });
      });
    });
  });
</script>

<button>获得 JSON 数据</button></br></br>
<span></span>