返回顶部
首页 > 资讯 > 前端开发 > html >Ajax学习点有哪些
  • 957
分享到

Ajax学习点有哪些

2024-04-02 19:04:59 957人浏览 薄情痞子
摘要

ajax学习点有哪些,针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。Ajax: Asynchronous javascript and Xm

ajax学习点有哪些,针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。

Ajax: Asynchronous javascript and Xml , 异步js脚本和xml , 常用来实现页面局部的异步刷新, 对提高用户体验有很大帮助. Xml在多语言时较有优势, 但Ajax技术实际上较多采用JSON对象而不是Xml来处理数据.

Ajax历史

Ajax归属于WEB前端开发技术, 与javascript有着异常紧密的联系. Ajax就是一种实现异步通信无刷新的技术, 而这种技术可以有很多种实现方式. 浏览器的鼻祖网景(NetScape)公司最早发明了LiveScript脚本语言, 用来丰富网页元素的表现形式, 使网页能够呈现出动态效果. 随后的历次改版升级后就诞生了JavaScript语言, 与此同期微软(Microsoft)公司也看到互联网的前景, 开始涉足并发力于互联网行业, 推出了JScript语言, 可惜没有JavaScript成熟, 发展迟滞. 最终微软公司对互联网的决心促成了MS对NS的漫长曲折的收购历程.

这里提一下, 动态html语言(Dynamic Hyper Text Markup Language)就是将javascript放在Dom树的元素节点中, 为元素提供动态展示行为.

Ajax代码思路

创建请求对象

配置请求对象并发送到服务器

服务器应答请求对象

(1) 创建请求对象,作为和服务器进行通讯的对象:

function createRequest(){
try{
var request=new XMLHttpRequest();
}catch(tryMS){
try{
request=new ActiveXObject("Msxml2.XMLHTTP");
}catch(otherMS){
try{
request=new ActiveXObject("Microsoft.XMLHTTP");
}catch(failed){
request=null;
}
}
}
return request;
}

注:ActiveXObject是Microsoft特定的一种编程对象,有两个不同版本由不同浏览器分别支持。XMLHTTP是可以在Javascript等脚本语言中通过http协议传送或接收XML及其他数据的一套api

获得请求对象request后,它有这么些个属性:

Ajax学习点有哪些

常用的有onreadystatechange,readyState,responseText,status。

Ajax学习点有哪些

(2)配置请求对象并发送到服务器:

var request=createRequest();
request.open("GET",url,true);
request.onreadystatechange=showResponse;
request.send(null);

open,send方法均来自request对象的原型XMLHttpRequest,打开__proto__:XMLHttpRequest可看到:

Ajax学习点有哪些

open()方法有三个参数,第一个是发送请求所使用的方法(GET还是POST,区别以后再总结),第二个是规定服务器端脚本的url(该文件可以是任何类型的文件),第三个参数规定是否进行异步处理(默认true异步)

send()方法将请求送往服务器。

我在这里注意到,request.onreadystatechange=showResponse;这句代码所在的位置不同,控制台输出的响应内容就不同。想来也是,回调函数加入任务队列的时机不同肯定输出不同啊,就比如现在这个位置,

request.onreadystatechange=showResponse;在open之后send之前,当代码解析到request.onreadystatechange=showResponse;时,此时的readyStates=1(请求已和服务器建立接连),此后当readyStates由1变为2,回调函数showResponse加入任务队列中等待被执行,readyState从2变化到3,回调函数showResponse第二次加入任务队列,readyState从3变化到4,回调函数再次加入队列。所以猜想当主代码执行完毕后,控制台会输出“请求已发送,服务器已接收,send之后”,“请求正在处理”,“请求已完成”;确实如此:

Ajax学习点有哪些

(3)服务器应答请求对象,js就可以处理响应内容了:

function showResponse(){
if(request.readyState==0){
console.log('请求未初始化,调用open之前');
}else if(request.readyState==1){
console.log('请求已提出,服务器连接已建立,open之后send之前');
}else if(request.readyState==2){
console.log('请求已发送,服务器已接收,send之后');
}else if(request.readyState==3){
console.log('请求正在处理');
}else if(request.readyState==4){
console.log('请求已完成');
if(request.status==200){
//处理request.responseText;
}
}
}

上面代码仅是为了跟踪readyState变化,实际项目代码要不了这么多。底下才是实际主要代码:

function showResponse(){
if(request.readyState==4){
if(request.status==200){
//处理request.responseText;
}
}
}

ps:Ajax解决什么问题

我们都知道, 在客户端向服务器请求一个页面时, 服务器首先动态的计算并生成出页面, 然后再发给客户端. 客户端浏览器顺序编译并呈现页面.

在没有Ajax时: 假如说页面有个用户验证控件, 那么在客户端浏览器呈现用户验证控件时, 会等待服务器的验证结果, 收到结果后才能继续呈现页面元素. 而这个验证过程通常要进行读取数据库等操作, 这就是所谓的同步方式. 而这种方式, 会造成网页呈现的假死状态.

在使用Ajax后: 同样是验证控件, 客户端提交了验证请求后, 便继续顺序呈现其他元素. 当取得验证结果后, 由javascript在客户端修改内存中的DOM对象后并呈献给用户(注意: 这里修改的只是内存中的DOM对象, 而客户端接收的页面文件并没有修改). 这样, 使用异步的方式, 就不会出现假死状态, 同时客户端也节省了等待服务器返回结果时的时间开销.

Ajax学习点有哪些

关于Ajax学习点有哪些问题的解答就分享到这里了,希望以上内容可以对大家有一定的帮助,如果你还有很多疑惑没有解开,可以关注编程网html频道了解更多相关知识。

--结束END--

本文标题: Ajax学习点有哪些

本文链接: https://www.lsjlt.com/news/81443.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • Ajax学习点有哪些
    Ajax学习点有哪些,针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。Ajax: Asynchronous JavaScript and Xm...
    99+
    2024-04-02
  • C++有哪些学习要点
    本篇内容介绍了“C++有哪些学习要点”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成! 内联函数(inline)在实现上实际和宏类似,在内联函数...
    99+
    2023-06-17
  • C++学习要点有哪些
    这篇文章主要介绍“C++学习要点有哪些”,在日常操作中,相信很多人在C++学习要点有哪些问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”C++学习要点有哪些”的疑惑有所帮助!接下来,请跟着小编一起来学习吧! 传...
    99+
    2023-06-17
  • JavaScript学习知识点有哪些
    这篇文章主要为大家展示了“JavaScript学习知识点有哪些”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“JavaScript学习知识点有哪些”这篇文章吧。一...
    99+
    2024-04-02
  • Ajax必须要学的知识点有哪些
    这篇文章主要为大家展示了“Ajax必须要学的知识点有哪些”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“Ajax必须要学的知识点有哪些”这篇文章吧。一、Ajax简...
    99+
    2024-04-02
  • Web安全学习知识点有哪些
    这篇文章主要讲解了“Web安全学习知识点有哪些”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“Web安全学习知识点有哪些”吧!一名合格的Web安全工程师是要具备很多的知识点,不但要对网站架构熟...
    99+
    2023-06-27
  • Java学习过程的重点有哪些
    本篇文章给大家分享的是有关Java学习过程的重点有哪些,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧。Java学习过程的重点主要说说Java的几大块吧,无法说得很细,因为其实每一...
    99+
    2023-06-03
  • Ajax的优缺点有哪些
    这篇文章主要介绍Ajax的优缺点有哪些,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!Ajax,全称 Asynchronous Javascript and XML,是一个动态的WEB...
    99+
    2024-04-02
  • Ajax的优点与缺点有哪些
    这篇文章主要介绍“Ajax的优点与缺点有哪些”,在日常操作中,相信很多人在Ajax的优点与缺点有哪些问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”Ajax的优点与缺点有哪些”...
    99+
    2024-04-02
  • 新手学习Java语言的要点有哪些
    这篇文章主要讲解了“新手学习Java语言的要点有哪些”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“新手学习Java语言的要点有哪些”吧!一、掌握静态方法和属性 静态方法和属性用于描述某一类对...
    99+
    2023-06-17
  • Ajax技术有哪些优缺点
    这篇文章主要讲解了“Ajax技术有哪些优缺点”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“Ajax技术有哪些优缺点”吧!ajax:Asynchronous ...
    99+
    2024-04-02
  • Python机器学习的基础知识点有哪些
    这篇文章主要介绍了Python机器学习的基础知识点有哪些,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。一、基础概述机器学习(Machine Learing)是一门多领域交叉学...
    99+
    2023-06-15
  • 学习css要注意哪些要点
    本文小编为大家详细介绍“学习css要注意哪些要点”,内容详细,步骤清晰,细节处理妥当,希望这篇“学习css要注意哪些要点”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。学习css这...
    99+
    2024-04-02
  • Java学习目标有哪些
    这篇文章给大家分享的是有关Java学习目标有哪些的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。  1.你需要精通面向对象分析与设计(OOA/OOD)、涉及模式(GOF,J2EEDP)以及综合模式。你应该十分了解U...
    99+
    2023-06-03
  • Python学习方法有哪些
    本篇内容主要讲解“Python学习方法有哪些”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“Python学习方法有哪些”吧!  1、找简单易懂、例程比较好的教程,从头看到结尾,不要看很多本,专注于...
    99+
    2023-06-01
  • Ajax的重要知识点有哪些
    这篇文章主要介绍“Ajax的重要知识点有哪些”,在日常操作中,相信很多人在Ajax的重要知识点有哪些问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”Ajax的重要知识点有哪些”...
    99+
    2024-04-02
  • 深度学习和机器学习有哪些区别
    本文小编为大家详细介绍“深度学习和机器学习有哪些区别”,内容详细,步骤清晰,细节处理妥当,希望这篇“深度学习和机器学习有哪些区别”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。深度学习和机器学习最大的区别就是“性能...
    99+
    2023-06-29
  • Axios中值得学习的核心知识点有哪些
    本篇内容介绍了“Axios中值得学习的核心知识点有哪些”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!一、A...
    99+
    2024-04-02
  • Web前端开发学习入门知识点有哪些
    这篇文章主要介绍“Web前端开发学习入门知识点有哪些”,在日常操作中,相信很多人在Web前端开发学习入门知识点有哪些问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”Web前端开...
    99+
    2024-04-02
  • 学习java的网站有哪些
    1、Stack overflowStack可能是编程界中非常流行的网站了 , 是一个与程序相关的 IT 技术问答网站,用户可以在网站免费提交问题,浏览问题,索引相关内容,在创建主页的时候使用简单的 HTML 。一部分的程序员学习 API 或...
    99+
    2019-05-07
    java入门 学习 java 网站
软考高级职称资格查询
推荐阅读
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作