Ajax,纯Js+Jquery
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Ajax,纯Js+Jquery相关的知识,希望对你有一定的参考价值。
AJAX:Asynchronous javascript and xml 异步,Js和Xml 交互式网页开发 不刷新页面,与服务器交互 详情请参照Jquery工具指南
用在浏览器端的技术,无刷新,通过XmlHttpRequest访问页面
纯js版----------
if(XmlHttpRequest){ //判断是否支持XmlHttpRequest xhr= new XmlHttpRequest(); // 创建XmlHttpRequest对象 } else{ xhr= new Activexobject("Microsoft.XMLHTTP"); //不支持XmlHttpRequest,使用此方法创建 } xhr.open("get|post","url",true); xhr.send(); // 开始发送 xhr.onreadystatechange= function(){ // 回调函数,当服务器将数据返回给浏览器触发方法 if(xhr.readyState==4) //0没调用open方法,1表示未调用send方法,2正在等待状态码和头的返回,3 已接受部分数据,但还没接受完,不能使用该对象的属性和方法,4已加载,所有数据执行完毕 if(xhr.status==200){ // 响应状态码,表示页面执行无误 alert(xhr.responseText); // 输出接受到的文本 } }
发送post请求
在send中写数据。并添加请求报头
如
xhr.setRequestHeader("Content-Type",application/x-www-form-urlencoded) xhr.send("id=123&pwd=456");
-------------------------------------
Jquery版
强大的Jquery。。只需要get页面就够了
$.get("url",{"id" : "123","pwd":456},function(data)){ //自动把参数当做get请求传输 alert(data) }
只需要post页面。
$.post("url",{"id" : 123,"pwd":456},function(data)){ //post请求 alert(data) }
//第三种写法
$.ajax({ type="get"| post, url="...", data:"参数", success:function(msg){...} // msg为从服务器接受到的数据 })
以上是关于Ajax,纯Js+Jquery的主要内容,如果未能解决你的问题,请参考以下文章