ajax基础

AJAX

  • 概念: 异步javascript和XML(json).

  • 作用:进行数据交换,使网页实现异步更新,可以只对网页的某部分进行更新,这也是它的主要用途,像新浪微博、各类电子地图,手机端的大部分页面等等都用了AJAX.

如何使用AJAX来请求数据

1、创建XMLHttpRequest对象(要考虑到标注浏览器的做法,和老版浏览器的差异)

2、向服务器发送请求

2.1配置请求

2.2发送请求

2.3监听readystatechange事件

详细请求步骤

1、创建出XMLHttpRequest对象

需要考虑 浏览器的兼容性

var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');

2.1、配置请求(初始化请求信息)

xhr.open('GET', 'data.json', true);//get参数写在url里?

xhr.open('POST', 'data.json', true);

2.2、发送请求

xhr.send(null);//get发送方式

xhr.send('usr=123&pass=123');//post发送方式 参数写在send里

2.3、监听请求结果(返回值)

xhr.onreadystatechange = function () {
  
  if (xhr.readyState == 4 && xhr.status == 200) {

    var result = JSON.parse(xhr.responseText);

   }

 }

JSON:json是一种基于文本的数据交换格式

JSON是一种简单数据格式,它有三种数据结构:

键值对(属性) —— Name/Value (Key/Value)

对象 —— Object

数组 —— Arrays

{

"book":[{

"name":"西游记",

"writer":"吴承恩",

"price":"30"},

{

"name":"《红楼梦》",

"writer":"曹雪芹",

"price":"50"}

]

}

上面代码的格式就是使用的基本形式,book就是对象,{}里的是键值对(也可以称为属性)他们用“,”隔开使用,[ ] 就是数组,在JSON中[]来包含数组元素。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • AJAX 概念: 异步javascript和XML(json). 作用:进行数据交换,使网页实现异步更新,可以只对...
    行不离书阅读 180评论 0 0
  • 本文介绍了Ajax最基础的操作和概念,希望能帮助大家初步认识Ajax 1.基本概念 AJAX = Asynchro...
    阿r阿r阅读 2,782评论 2 30
  • AJAX(Asynchronous Javascript And XML) 概念:无需加载整个网页就可更新部分网页...
    nanamii阅读 315评论 1 0
  • 12.28学习经验分享# Bruce_Zhu于2016.12.29 一、同步交互与异步交互 客户端想服务器端发送请...
    旅行的意义zxy阅读 312评论 0 0
  • 能量朗读:规画1遍,论语第一篇1遍,祖先祈祷文1遍,零极限300遍 爱的表达:宝贝,你今天又进步了,你真棒! 自我...
    馬雙麗阅读 157评论 0 0