ajax
应用场景:
asynchronous javascript and xml == ajax
在注册一个网站,输入用户名时,ajax其实就是js对象,应用在与服务器进行交互的过程在搜索框中输入内容,下边会显示一些高频的词汇局部页面刷新
使用ajax步骤:
ajax对象var xhr = new XMLHttpRequest();xhr.open()//1. 请求的方式get post 2.请求的连接地址 3.是异步请求还是同步请求 默认是异步请求 true 同步请求falsexhr.send();
总结:
以get方式传递参数请求后台数据 var xhr = new XMLHttpRequest(); xhr.open(‘get’, ‘url地址’, ‘是异步还是同步’) xhr.send();以post方式 var xhr = new XMLHttpRequest(); xhr.open(‘post’, ‘url地址’, ‘是异步还是同步’) xhr.setRequestHeader(“Content-type”,“application/x-www-form-urlencoded”); xhr.send(传递后台需要的参数);
ajax对象属性
responseText: 从后台返回来的json数据onreadystatechange:是一个事件, 当ajax的状态发生改变的时候来触发它readyState:(0,1,2,3,4) 0:初始化 1.执行了open方法\执行send方法 2.载入完成,接收服务器端的响应数据 3.解析接收到的服务器端响应数据 4.数据都已经解析为客户端可用的格式,解析已经完成status: 响应成功后返回的状态 一般 200 OK
ajax请求函数封装
encodeURIComponent
同步和异步
同步: 当我们请求服务器时,服务器处理完数据之后返回过来,然后与前台一起执行.异步:当我们请求服务器时,服务器自己处理数据,并且前台程序执行没有关系,.前台程序继续往下执行,等后台数据处理完之后再往下执行. [注]在实际开发中大多数都用到异步请求
跨域的问题:
跨域其实就是跨域名进行请求 127.0.0.1 和 localhost 不是同一个域名
一般情况通过ajax是没办法跨域的; 现在我们要想进行ajax跨域怎么办? 答: 我们可以通过两种进行ajax跨域
方式一: 在请求的PHP文件中写上header头
header(‘Access-Control-Allow-Origin:*’);
方式二:在js中自定义一个函数
function fn(data
)
{
var obj
= JSON.parse(data
);
console
.log(data
);
}
在js中直接引入这个文件
<script type
="text/javascript" src
="http://www.test.com/index.php"></script
>
配置虚拟主机域名:
修改hosts文件 c://windows/system32/drivers/etc/hosts修改apache配置文件C:\wamp64\bin\apache\apache2.4.17\conf修改C:\wamp64\bin\apache\apache2.4.17\conf\extra
<VirtualHost *:80> ServerName www.test.com DocumentRoot c:/wamp64/www/test <Directory “c:/wamp64/www/test/”> Options Indexes FollowSymLinks MultiViews AllowOverride All Require local </VirtualHost>