一、前言

在编写前端，总要通过 ajax 请求调用后端接口，获取 json 数据，再渲染到页面上。但是问题来了，后端的接口还没编写咋整，只能自己模拟搞一个了。

二、代码

在项目的顶级目录下，创建一个 static 目录，表示用来存储静态资源（图片、我们的 json 等），在里边存放 json 数据，这里在里边再创建了一个 data 目录，存放 heatChinaRealData.json，然后就可以发起 ajax 请求了，这里使用了 axios。

本小节基本要求

• 了解html文件

要点：

1. JSON格式的数据
2. Javascript(简称js)语言
3. 样式选择器之ID选择器

一.JSON

JSON也是一种字符串，是一种特殊的字符串，json对象既可以是字符串也可以是数值，null，数组，对象。

1，了解json, xml数据格式：

xml数据格式是利用标签对数据就行组装，标签必须成对出现，且必须以<?xml version="1.0" encoding="utf-8" ?>开头 但是因为标签必须成对出现导致文件体积大，标签数量太多，实在是影响传输效率，因此使用频率不高，下面是xml数据格式的例子

<?xml version="1.0" encoding="utf-8"?>
<students>
	<student>
		<name>张三</name>
		<age>30</age>
		<sex>男</sex>
	</student>
	<student>
		<name>李四</name>
		<age>25</age>
		<sex>男</sex>
	</student>
	<student>
		<name>王五</name>
		<age>27</age>
		<sex>女</sex>
	</student>
</students>

#头条创作挑战赛#

以前传统的网页（不使用 Ajax）如果需要更新内容，就必须重新加载整个网页。当一个页面有 大量的 JavaScript、图片、CSS 时，加载速度会变得非常缓慢。而 Ajax 的出现很好地解决了这个问题。

## 今日内容

1. AJAX：

2. JSON

一、AJAX：

1.1 概念： ASynchronous JavaScript And XML，异步的JavaScript 和XML

客户端和服务器端相互通信的基础上

什么是ajax?

ajax就是一个异步的javascript和xml，你可以不要太在意书面上的意思，你要知道，我们向后台请求数据，除了基本的form表单外，大多数情况下我们是使用的ajax向后台发送请求，ajax比form表单的功能更强大！

Java本地访问（JNA）是一个勇敢的开源尝试，通过一个更直观和易于使用的API来解决JNI的复杂性。作为一个第三方库，JNA必须作为依赖项添加到我们的项目中：