js进阶课程ajax简介(ajax是浏览器来实现的)
一、总结
1、ajax使用需要服务器支持,比如phpstudy
2、ajax是浏览器支持的功能:ajax有个核心对象XMLHttpRequest,这个对象时浏览器提供支持的,是浏览器windows对象的一个对象,window.XMLHttpRequest
3、ajax兼容性问题:大部分浏览器都支持ajax,IE6不支持ajax的XMLHttpRequest对象,但是支持ajax的ActiveXObject对象
二、js进阶课程ajax简介
准备工作
配置本地服务器环境,这里推荐安装:phpstudy,优点:一次性安装,无须配置即可使用,非常方便
Ajax 简介
什么是 Ajax ?
AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)
AJAX 可以通过在后台与服务器进行少量数据交换,使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。
传统的网页(不使用 AJAX)如果需要更新内容,必需重载整个网页面。
Ajax 的基本用法
创建 XMLHttpRequest 对象
语法:var myAjax=new XMLHttpRequest();
老版本的 IE(IE5 和 IE6)使用 ActiveX 对象:
var myAjax=new ActiveXObject("Microsoft.XMLHTTP");
向服务器发送请求:使用open() 和 send() 方法:
open(method,url,async):规定请求的类型、URL 以及是否异步处理请求。
method:请求的类型;GET 或 POST
url:文件在服务器上的位置
sync:true(异步)或 false(同步)
send(string):string:仅用于 POST 请求
服务器响应
如需获得来自服务器的响应,请使用 XMLHttpRequest 对象的 responseText 或 responseXML 属性。
responseText 属性:responseText 属性返回字符串形式的响应
responseXML 属性:如果来自服务器的响应是 XML,而且需要作为 XML 对象进行解析,请使用 responseXML 属性
onreadystatechange 事件
当请求被发送到服务器时,我们需要执行一些基于响应的任务。 每当 readyState 改变时,就会触发 onreadystatechange 事件。
XMLHttpRequest 对象的三个重要的属性:
onreadystatechange:存储函数(或函数名),每当 readyState 属性改变时,就会调用该函数。
readyState:存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。
0: 请求未初始化
1: 服务器连接已建立
2: 请求已接收
3: 请求处理中
4: 请求已完成,且响应已就绪
status:200: "OK"/404: 未找到页面
三、代码
ajax01var btn=document.getElementById('btn')
btn.οnclick=function (){
//1.创建Ajax对象
var myajax=new XMLHttpRequest()
alert(myajax) //IE6及其以下版本不支持
/*
if (window.XMLHttpRequest){ //1、XMLHttpRequest对象时浏览器的window对象下的一个对象 var myajax=new XMLHttpRequest() //2、ajax向下兼容IE5和IE6的方法:选择结构 }else{
var myajax=new ActiveXObject("Microsoft.XMLHTTP"); //3、ajax向下兼容IE5和IE6的方法:ActiveXObject对象
}
*/
}
js进阶 14 jquery的ajax有哪些函数和事件(多练)
js进阶 14 jquery的ajax有哪些函数和事件(多练) 一.总结 一句话总结:常用:load.ajax.post.get.getScript().getJSON().表单序列化,ajax事件这 ...
js进阶 14-7 jquery的ajax部分为什么需要对表单进行序列化
js进阶 14-7 jquery的ajax部分为什么需要对表单进行序列化 一.总结 一句话总结:如果用ajax传递表单的数据,如果不进行表单的序列化,要一个参数一个参数的写,太麻烦,序列化的话,一句代 ...
js进阶 14-2 如何用ajax验证登陆状态(这里用load方法)
js进阶 14-2 如何用ajax验证登陆状态(这里用load方法) 一.总结 一句话总结:$('#test').load('test.php?password=1234560'),这样就get方式提 ...
js进阶 14-1 jquery的ajax系列中的load方法的作用是什么
js进阶 14-1 jquery的ajax系列中的load方法的作用是什么 一.总结 一句话总结:jQuery load()方法作用是从服务器加载数据,是一个简单但强大的AJAX方法. 1.load函 ...
js进阶课程 12-9 jquery的事件对象event的方法有哪些?
js进阶课程 12-9 jquery的事件对象event的方法有哪些? 一.总结 一句话总结:三组六个,阻止默认事件一组,阻止冒泡一组,阻止冒泡和剩余事件一组. 1.事件的默认动作指什么? 比如点a标 ...
$Django ajax简介 ajax简单数据交互,上传文件(form-data格式数据),Json数据格式交互
一.ajax 1 什么是ajax:异步的JavaScript和xml,跟后台交互,都用json 2 ajax干啥用的?前后端做数据交互: 3 之前学的跟后台做交互的方式: -第一种:在浏览器 ...
PHP AJAX 简介
AJAX 简介 AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术. AJAX 是什么? AJAX = Asynchronous JavaScript and XML. AJAX ...
js进阶ajax基本用法(创建对象,连接服务器,发送请求,获取服务器传过来的数据)
js进阶ajax基本用法(创建对象,连接服务器,发送请求,获取服务器传过来的数据) 一.总结 1.ajax的浏览器的window对象的XMLHtmlRequest对象的两个重要方法:open(),se ...
随机推荐
Javascript use strict模式和对象
use strict 只能出现在脚本代码的开始或者函数体的开始.任何实体语句之前.Javascript的具体实现将它们解析为解释器自有的指令.这个指令的目的是说明后续的代码将会解析为严格代码. ECM ...
UNIX网络编程学习指南--epoll函数
epoll是select/poll的强化版,都是多路复用的函数,epoll有了很大的改进. epoll的功能 1.支持监听大数目的socket描述符 一个进程内,select能打开的fd是有限制的,有 ...
Qt线程(2) QThread中使用WorkObject
一般继承QThread的WorkThread都会在重载的run()中创建临时的WorkObject,这样能确定这个WorkObject在该thread中使用 那如果这个WorkObject是个Sing ...
Java——设计模式(装饰模式_IO)
/* * 装饰设计模式: * 对一组对象的功能进行增强时,就可以使用该模式进行问题的解决; * 装饰和继承都能实现一样的特点: 就是进行功能的扩转增强. * */ public class ...
How do I place a group of functions or variables in a specific section?
http://supp.iar.com/Support/?Note=27498 EWARM v5.xx (and newer) The placement of a few functions in ...
ZOJ 3822 Domination
题意: 一个棋盘假设每行每列都有棋子那么这个棋盘达到目标状态 如今随机放棋子 问达到目标状态的期望步数 思路: 用概率来做 计算第k步达到目标状态的概率 进而求期望 概率计算方法就是dp ...
angularjs表单中enter键提交
html页面:
iBATIS使用$和#的一些理解
我们在使用iBATIS时会经常用到#这个符号. 比如: sql 代码 select * from member where id =#id# 然后,我们会在程序中给id这个变量传递一个值,iBATIS ...
codeforces1152 div2
比赛的链接 C gcd(a+k, b+k) == gcd(a+k, b-a) #include using namespace std; const int ...
DWM1000 巧用Status 快速Debug
在Debug DWM1000 的时候,可以巧用Status 加快Debug,例如如下代码 if (status_reg & SYS_STATUS_RXFCG) { …… } else { sp ...