ctrl+f:全局替换
alt+鼠标左键：整列编辑
ctrl+alt+l：格式化
AJAX
简介
概念：AJAX：异步（客户端不用等待服务端的反应）的Javascript和XML
AJAX的作用：
-
与服务器进行数据交互：通过AJAX可以给服务器发送请求，并获取服务器响应的数据
使用AJAX和服务器进行通信，就可以使用HTML+AJAX来替换JSP页面了
-
异步交互：可以在不重新加载整个页面的情况下，与服务器交换数据并更新部分网页的数据，如：搜索联想、用户名是否可用校验，等等
使用步骤
—>用w3school前端技术手册查询要用到的技术步骤和代码
- 编写AjaxServlet，并使用response输出字符串
- 创建XMLHttpResquest对象：用于和服务器交换数据
- 向服务器发松请求
- 获取服务器响应数据
<script>
//创建核心对象
var xhttp;
if (window.XMLHttpRequest) {
xhttp = new XMLHttpRequest();
} else {
// code for IE6, IE5
xhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
//发送请求
xhttp.open("GET", "http://localhost:8080/ajax-demo/ajaxServlet");
xhttp.send();
//获取响应
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
alert(this.responseText);
}
}
</script>
xhr:表示异步请求
校验用户是否存在
Axios异步框架
基本使用
- 引入axios的js文件
<script src="js/axios-0.18.0.js"></script>
- 使用axios发送请求，并获取响应结果
get方式
<script>
axios({
method:"get",
url:"http://localhost:8080/ajax-demo/axiosServlet?username=zhangsan"
}).then(function (res) {
alert(res.data);
})
</script>
post方式
<script>
axios({
method:"post",
url:"http://localhost:8080/ajax-demo/axiosServlet",
data:"username=zhangsan"
}).then(function (res) {
alert(res.data);
})
</script>
请求方式别名
为了方便起见，axios已经为所有支持的请求方式提供了别名
get的别名方式
<script>
axios.get("http://localhost:8080/ajax-demo/axiosServlet?username=zhangsan").then(function (res) {
alert(res.data);
})
</script>
post的别名方式
<!--post的别名方式-->
<script>
axios.post("http://localhost:8080/ajax-demo/axiosServlet","username=zhangsan").then(function (res){
alert(res.data)
})
</script>
