美文网首页
关于ajax小知识

关于ajax小知识

作者: 彭于晏的老婆呀 | 来源:发表于2018-08-12 23:57 被阅读0次

AJAX = 异步的 JavaScript 和 XML

AJAX是基于现有的Internet标准,并且联合使用它们:

1.XMLHttpRequest 对象 (异步的与服务器交换数据);

2.JavaScript/DOM (信息显示/交互);

3.CSS (给数据定义样式)

4.XML (作为转换数据的格式)

关于AJAX的使用:

1.创建XMLHttpRequest对象

var xmlhttp;

if (window.XMLHttpRequest){

 // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码

 xmlhttp=new XMLHttpRequest();

}else

{ // IE6, IE5 浏览器执行代码 

 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");

}


2.向服务器发送请求

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

 //有两种get跟post方式,

get:字符提交 安全性不高 处理时间快;

post:  字节提交  安全性比get高  处理时间慢  文件传输都用post;

xmlhttp.send();


3.服务器响应

xmlhttpre.onreadystatechange = function () {

                if(xmlhttpre.readyState == 4 && xmlhttpre.status == 200){

                    //请求成功

                    var date2 = new Date();

                    console.log(xmlhttpre.responseText);

                    console.log("date2:"+(date2.getTime()-date1.getTime()));

                }

            }


4.onreadystatechange 事件:

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

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

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

xmlhttpobjt.onreadystatechange = function () {

//                if(xmlhttpobjt.status == 200 && xmlhttpobjt.readyState == 4){

//                    //请求完成

//                  alert(xmlhttpobjt.responseText) ;

//                }

                if(xmlhttpobjt.readyState == 2){

                    alert("2:"+xmlhttpobjt.responseText) ;

                }

                if(xmlhttpobjt.readyState == 3){

                    alert("3:"+xmlhttpobjt.responseText) ;

                }

                if(xmlhttpobjt.readyState == 4){

                    alert("4:"+xmlhttpobjt.responseText) ;

                }

            }


一个简单的登陆操作:

逻辑思维分为以下几个步骤:

1.在body中定义登录框、密码框、提交框;

相关文章

  • 关于ajax小知识

    AJAX = 异步的 JavaScript 和 XML AJAX是基于现有的Internet标准,并且联合使用它们...

  • JavaScript-ajax实践

    小练习: 题目1: ajax 是什么?有什么作用? 关于ajax AJAX即“Asynchronous JavaS...

  • AJAX小知识

    1.如何发请求? 我们知道有几种方式可以发请求,但是都有其局限性,如下: 用 form 可以发请求,但是会刷新页面...

  • AjaX小知识

    人生就是一个不断认识与遗憾的过程,总有一天,你会模糊掉我的印记,而我也将遗忘你的身影,不管那些年之前,我们多么的亲...

  • JavaScript进阶知识点--AJAX及JSON

    AJAX 关于 AJAX 什么是 AJAX AJAX 的全称是 Asynchronous JavaScript a...

  • zepto源码分析·ajax模块

    准备知识 在看ajax实现的时候,如果对ajax技术知识不是很懂的话,可以参看下ajax基础,以便读分析时不会那么...

  • 关于ajax

    关于ajax 1. 基础知识 网络协议: 通讯的标准 应用层协议: http, https, ftp, ... h...

  • 2018-12-03 ajax原理及实现方式

    Ajax工作原理及实例 1、关于ajax的名字 ajax 的全称是Asynchronous JavaScript ...

  • Ajax实现登陆验证

    关于jquery与Ajax jQuery 提供多个与 AJAX 有关的方法。通过 jQuery AJAX 方法,能...

  • JavaWeb学习-Ajax-1-Ajax简介

    JavaWeb学习-Ajax-1-Ajax简介 进入到一个新的知识点的学习,这个知识点叫做Ajax,指的是异步的j...

网友评论

      本文标题:关于ajax小知识

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