Js is used to read the data returned from the server side of the dynamic website


In HTML, js is used to read the data returned from the server side of the dynamic website for display

1. Js. HTML page

You need to introduce a js file that executes jquery


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<script src="jquery-1.8.2.min.js"></script>

<script>

$(function(){
//$("#loaddata").click(function(){
$(document).ready(function(){
//Using the getJSON method to read the json data,
//Note: info.json can be a different type of file, as long as the data in it is of the json type
$.getJSON('info.json',function(data){

var html = '';
$.each(data,function(i,item){
html += '<tr><td>'+item['name']+'</td>'+
'<td>'+item['sex']+'</td>'+
'<td>'+item.address+'</td>'+
'<td>'+item['home']+'</td></tr>';
});
$('#title').after(html);
//After method: inserts content after each matched element.
});
});
});

//Note: this can be either item. Address or item['address']
//Firefox reports a "syntax error" in the json file, which simply loads the data
//Ie chrome could not load the data
</script>
</HEAD>
<input type="button" value=" Load the data " id="loaddata" />

<BODY>
<table id="infotable" >
<tr id="title"><th> The name </th><th> gender </th><th> address </th><th> The home page </th></tr>
</table>
</BODY>
</HTML>

Info. Json file


[
{
"name":"zhangsan",
"sex":"man",
"address":"hangzhou",
"home":"http://www.zhangsan.com"
},
{
"name":"lisi",
"sex":"wumen",
"address":"beijing",
"home":"http://www.lisi.coms"
}
]

Application scenario:

Specific records that are read from the database on a regular basis are displayed on a static page. In order to reduce the pressure of database access, a specific number of records are taken out and stored in json. Page access links do not require a real-time request to the database.

At this point you can load the content from json into the HTML static as well.

The json saved by default must be a notepad, and then change the suffix to json. Notepad’s default code is ANSI.

Solution: open the. Json file file - save as you can see the following encoding and select utf-8.

Here’s another mistake: Request json file to report 405 error, obviously the path is correct but still report an error. Solution: modify the request mode to get request: