前端JSsetter Getter 及 Ajax

web前端开发项目经验描述 前端开发项目经验总结 1000元的前端开发项目
setter Getter
可以读取或者设置类里面的私有属性;
类的静态方法(类方法):
使用类名去调用
好处:节省内存,(不用实例化对象去调用那些方法)
使用环境:工具类,不需要使用this的方法;
Ajax:(技术的名字)
Asynchronous Javascript And XML
异步的JavaScript和XML;
作用:与服务端交互,读取文件
实现所使用到的类:
XMLHttpRequest:不兼容IE5、IE6;
ActiveXObject:兼容IE5、IE6;
客户端服务端通信是通过http这个协议进行通信的,http有两个方法:
1.GET:参数传到URL里面;
使用?把接口地址跟参数隔开;多个参数使用&隔开。
2.POST:数据传输到body体里面;
传输的数据相对安全;传输的数据没有大小的限制。
3.DELETE
4.PUT
js中以GET方式发送一个请求;
var req = new XMLHttpRequest();
req.open(“GET”,”xxx”);
req.send();
req.onreadystatechange = function () {
alert(this.readyState);
};
js中接受服务端发到客户端里面的内容
XMLHttpRequest > response 回应
同步:一行行代码执行,遇到比较耗时的任务,会等耗时任务执行完毕后
继续执行(有耗时的任务程序会卡住,直到这个任务执行完成);
XMLHttpRequest 默认是异步的;
异步:
open三个参数的意义:XMLHttpRequest ->open(http的请求方
法,请求的地址,同步还是异步)
HTTP协议传输内容
两个方法:
GET:传输的参数是直接拼接到URL中的,与html直接传值一样,
需要使用?来隔开传递的参数,如果有多个参数,使用&隔
开每一个参数;
GET特点:
GET参数放到URL里面 -> 不能传比较大的参数(因为URL的大
小有限制); 参数是暴露在URL里面的;
GET传输速度要快一些 -> 只要不涉及到传大文件、密码、比较
重要的,都是用的GET;
POST:传输的参数放到body体中,传输的大小也没有限制;
要想跟服务端交互,得知道跟谁交互,需要知道的内容
1.请求数据的位置是哪儿
主机地址(IP或者域名)
需要指定具体文件的位置
2.需要使用哪一个HTTP 的方法
服务端提供的API要求使用哪个就使用哪个;
3.要传输的参数;
GET:拼接到URL,使用?拼接、使用&分隔
POST:请求参数是在http标题的一个不同部分(名为entity body)传
输的,这一部分用来传输表单信息,因此必须将
Content-type设置为:application/x-www-form- urlencoded。
post设计用来支持web窗体上的用户字段,
其参数也是作为key/value对传输。
但是:它不支持复杂数据类型,
因为post没有定义传输数据结构的语义和规则。
//在不知道值具体是什么类型的时候,
// 可以通过null赋值;
var result = null;
var request = new XMLHttpRequest();
//设置请求
//设置请求的http的方法GET
//设置请求的服务器位置:http://route.showapi.com/255-1
request.open(“GET”,”http://route.showapi.com/255-1″);
//request.send();
//监听客户端传输数据到服务端的传输状态
request.onreadystatechange = function () {
//readyState:读取传输的状态
console.log(this.readyState);
if(this.readyState ===XMLHttpRequest.DONE){
//response http的回应,里面有可能有咱们需要的值
alert(“交互完成”);
result = request.response;
}
};
request.send();
console.log(result);
——————————————————————————————————————–
var result = null;
var request = new XMLHttpRequest();
request.open(“GET”,”http://route.showapi.com/255-1″);
request.onreadystatechange = function () {
//readyState:读取传输的状态
console.log(this.readyState);
if(this.readyState ===XMLHttpRequest.DONE){
//response http的回应,里面有可能有咱们需要的值
alert(“交互完成”);
result = request.response;
var i = 0;
while (1){
i++;
if(i==99){
break;
}
console.log(i);
}
}
};
request.send();
document.write(result);
前端项目开发问题 前端开发项目经验总结 1000元的前端开发项目
» 本文来自:前端开发者 » 《前端JSsetter Getter 及 Ajax》
» 本文链接地址:https://www.rokub.com/38153.html
» 您也可以订阅本站:https://www.rokub.com
赞(0)
64K

评论 抢沙发

评论前必须登录!