jQuery ajax - getJSON() 方法获取数据,实现局部刷新(day5)
具体方法可参照以下教程
https://www.w3school.com.cn/jquery/ajax_getjson.asp
下面写了一个示例代码
DOCTYPE html>
<html lang="zh">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>ajax_testtitle>
<link rel="stylesheet" href="css/bootstrap.css">
<script src="js/jquery.min.js">script>
<script src="js/bootstrap.js">script>
head>
<body>
<table class="table table-striped" id="tab">
<tr>
<th>货物编号th>
<th>货物id号th>
<th>货物名称th>
<th>数量(个)th>
tr>
<tr>
<td>1td>
<td>12345td>
<td>洗面奶td>
<td>5td>
tr>
table>
<button id="btn">获得 JSON 数据button>
body>
<script type="text/javascript">
$(document).ready(function() {
$("#btn").click(function() {
$.getJSON("./source.txt", function(result) {
console.log(result);
var context = ""+result.no+" "+result.id+
" "+result.name+" "+result.num+" ";
$("#tab").append(context);
});
});
});
script>
html>
json文本
{
"no": 5,
"id": "00000",
"name": "牛奶",
"num": 50
}