Js is used to read the data returned from the server side of the dynamic website
- 2020-03-30 01:41:37
- OfStack
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
Info. Json file
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:
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: