美文网首页
AJAX初识

AJAX初识

作者: CodingHou | 来源:发表于2017-02-07 13:46 被阅读12次

AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)。是一种用于快速创建动态网页的技术

AJAX 不是新的编程语言,而是一种使用现有标准的新方法。

AJAX 是与服务器交换数据并更新部分网页的艺术,在不重新加载整个页面的情况下。

1、XMLHttpRequest 是 AJAX 的基础。

创建 XMLHttpRequest 对象的语法:

variable=new XMLHttpRequest();

XMLHttpRequest 对象用于和服务器交换数据。

如需将请求发送到服务器,我们使用 XMLHttpRequest 对象的 open() 和 send() 方法:

xmlhttp.open("GET","test1.txt",true);

xmlhttp.send();

方法描述

open(method,url,async)规定请求的类型、URL 以及是否异步处理请求。

method:请求的类型;GET 或 POST

url:文件在服务器上的位置

async:true(异步)或 false(同步)

send(string)将请求发送到服务器。

string:仅用于 POST 请求

GET 还是 POST?

与 POST 相比,GET 更简单也更快,并且在大部分情况下都能用。

然而,在以下情况中,请使用 POST 请求:

无法使用缓存文件(更新服务器上的文件或数据库)

向服务器发送大量数据(POST 没有数据量限制)

发送包含未知字符的用户输入时,POST 比 GET 更稳定也更可靠

2、服务器响应

如需获得来自服务器的响应,请使用 XMLHttpRequest 对象的 responseText 或 responseXML 属性。

属性描述

responseText获得字符串形式的响应数据。

responseXML获得 XML 形式的响应数据。

onreadystatechange 事件

当请求被发送到服务器时,我们需要执行一些基于响应的任务。

每当 readyState 改变时,就会触发 onreadystatechange 事件。

readyState 属性存有 XMLHttpRequest 的状态信息。

下面是 XMLHttpRequest 对象的三个重要的属性:

属性描述

onreadystatechange存储函数(或函数名),每当 readyState 属性改变时,就会调用该函数。

readyState存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。

0: 请求未初始化

1: 服务器连接已建立

2: 请求已接收

3: 请求处理中

4: 请求已完成,且响应已就绪

status200: "OK"

404: 未找到

在 onreadystatechange 事件中,我们规定当服务器响应已做好被处理的准备时所执行的任务。

当 readyState 等于 4 且状态为 200 时,表示响应已就绪:

xmlhttp.onreadystatechange=function()

{

if (xmlhttp.readyState==4 && xmlhttp.status==200)

{

document.getElementById("myDiv").innerHTML=xmlhttp.responseText;

}

}

3、从服务器请求的文件有asp和php两种。

相关文章

  • 初识Ajax

    ajax是一个老生常谈的问题,其实并不复杂,不过是因为老前辈通过这样的请求方式玩出了很多花样,迷乱了萌新的眼睛,话...

  • 初识ajax

    一、ajax介绍 ajax(Asynchronous Javascript And XML), 在前端的开发中主要...

  • Ajax 初识

    Ajax (Asynchronous JavaScript and XML)   即用JavaScript执行异步...

  • AJAX初识

    AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 X...

  • 初识Ajax

    一、ajax是什么? 1、Asynchronous JavaScript & XML2、web开发的一种技术3、异...

  • 初识ajax

    如何和后端交互 form表单的提交:点击submit提交,浏览器会默认自动的把input表单中的东西提交到form...

  • Ajax基础知识点总结

    Ajax 技术 第1章 认识Ajax 1.1 初识 ajax 我们平常上网,不管是注册账号,还是浏览网页,其本质就...

  • AJAX,node初识

    AJAX ajax是一种技术方案,但并不是一种新技术。它依赖的是现有的CSS/HTML/Javascript,而其...

  • Ajax相关总结

    一、 认识Ajax 1、 初识 ajax 我们平常上网,不管是注册账号,还是浏览网页,其本质就是通过客户端向服务器...

  • JavaScrip之初识Ajax

    什么是Ajax? ajax是一种技术方案,但并不是一种新技术。它依赖的是现有的CSS/HTML/Javascrip...

网友评论

      本文标题:AJAX初识

      本文链接:https://www.haomeiwen.com/subject/xoopittx.html