原生ajax jq跨域
- 原生js封装ajax
//创建XmlhttpRequest对象
function createXHR(){
var xhr=null;
if(XMLHttpRequest){
xhr=new XMLHttpRequest();
}else{
xhr=new ActiveXObject("Microsoft.XMLHTTP");
}
return xhr;
}
function ajax(data){
var xhr=createXHR();
//初始化 准备配置参数
var type,async;
type=data.type=='post'?'post':'get';
async=data.async?true:false;
xhr.open(type,data.url,async);
//如果是post，设置请求头 执行发送动作
if(type=='get'){
xhr.send(null);
}
else if(type=='post'){
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
xhr.send(data.data);
}
//这段代码在xhr.send();执行完之后才能执行 指定回调函数
xhr.onreadystatechange=function(){
if(xhr.readyState==4){
if(xhr.status==200){
if(typeof data.success=='function'){
var d=data.dataType=='xml'?xhr.responseXML:xhr.responseText;
data.success(d);
}
}else{
if(typeof data.error=='function'){
data.error();
}
}
}
}
}
2.jq ajax使用
ajax({
type:"get",//请求类型 默认get
url:"php/01-gettime.php",//地址
dataType:”json”,//返回数据类型
async:true,//是否异步 默认true
data:null, //参数
success: function (data) {
alert(data);
},
error: function () {
alert("错误");
}
})
//JSONP : 服务器把json数据包装到一个方法中
//客户端提供一个对应的方法，可以处理服务器返回的数据
3.js跨域 window.onload = function () {
//动态创建script标签
var script = document.createElement("script");
document.body.appendChild(script);
script.src = "http://v.juhe.cn/weather/index?format=1&cityname=%E5%8C%97%E4%BA%AC&key=e982f3629ae77eb7345b7e42f29b62ae&dtype=jsonp&callback=handle";
}
返回一个函数callback后面handle（）函数
//jsonp对应的方法
function handle(data) {
alert(data.resultcode);
}
4.jq跨域
$(function () {
$.ajax({
type:"get",
async：true,
url:"http://v.juhe.cn/weather/index?format=1&cityname=%E5%8C%97%E4%BA%AC&key=e982f3629ae77eb7345b7e42f29b62ae&dtype=jsonp",
dataType:"jsonp",
// jsonp:"cb", //将来会替换掉地址中的 callback
// jsonpCallback:"handle", //生成一个全局的方法 handle
success: function (data) {
alert(data.resultcode);
},
error: function () {
alert("error");
}
});
})
- Get和post区别
GET请求的数据会附在URL之后（就是把数据放置在HTTP协议头中），以?分割URL和传输数据，参数之间以&相连，如：login.action?name=hyddd&password=idontknow&verify=%E4%BD%A0%E5%A5%BD。
POST把提交的数据则放置在是HTTP包的包体中。
GET方式提交的数据最多只能是1024字节, 这个限制是特定的浏览器及服务器对它的限制
理论上讲，POST是没有大小限制的，HTTP协议规范也没有进行大小限制
Get是向服务器发索取数据的一种请求，而Post是向服务器提交数据的一种请求
- 中文乱码
js 程序代码：url=encodeURI(url)
- Function函数
//函数定义，可以先调用，后定义
Function fn(){
Console.log(111)
}
//函数表达式，不可以先调用
Var fn=function(){
Console.log(111)
}
//javascript 代码运行分连个阶段：
// 1、预解析 --- 把所有的函数定义提前，所有的变量声明提前，变量的赋值不提前
// 2、执行 --- 从上到下执行 （setTimeout，setInterval,ajax中的回调函数，事件中的函数需要触发执行）
- js 跨域
- jq 跨域jsonp使用
