首先得创建一个请求XMLHttpRequest对象,var  xmlhttp=window.XMLHttpRequest?new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");

IE5和6使用ActiveX对象,格式如红字部分;正常情况下XMLHttpRequest就行了,格式如蓝字部分

1.请求

发送请求到服务器,使用XMLHttpRequest的open()和send()方法:

open(method,url,async)

规定请求的类型、URL 以及是否异步处理请求。

  • method:请求的类型;GET 或 POST
  • url:文件在服务器上的位置
  • async:true(异步)或 false(同步)

send(string)

将请求发送到服务器。

  • string:仅用于 POST 请求

举例如下:

(1)xmlhttp.open("GET","demo_get2.asp?fname=Bill&lname=Gates",true);

xmlhttp.send();

(2)

xmlhttp.open("POST","ajax_test.asp",true);

xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");

xmlhttp.send("fname=Bill&lname=Gates");  ps:async=false时,及同步时,响应什么的放在send()后面

关于是使用get还是post:

get:简单快速,大部分情况可用

post:

  • 无法使用缓存文件(更新服务器上的文件或数据库)
  • 向服务器发送大量数据(POST 没有数据量限制)
  • 发送包含未知字符的用户输入时,POST 比 GET 更稳定也更可靠

2.获取响应结果

两个:responseText(获得字符串形式的响应数据)  responseXML(获得xml形式的响应数据),这两个也是XMLHttpRequest对象的方法,

结合上面建立的对象xmlhttp,可以这么使用xmlhttp.responseTest;

3.onreadystatechange事件

待补充

【前端学习笔记】2015-09-02 附~~~~~ajax简单请求和获得响应结果的更多相关文章

  1. 【前端学习笔记04】JavaScript数据通信Ajax方法封装

    //Ajax 方法封装 //设置数据格式 function setData(data){ if(!data){ return ''; } else{ var arr = []; for(k in da ...

  2. 【前端学习笔记】2015-09-11~~~~ js中ajax请求返回案例

    <body><textarea id='a' rows=100 cols=300>result:</textarea>><script>var a ...

  3. 【前端】Web前端学习笔记【1】

    ... [2015.12.02-2016.02.22]期间的学习笔记. 相关博客: Web前端学习笔记[2] 1. JS中的: (1)continue 语句 (带有或不带标签引用)只能用在循环中. ( ...

  4. 【前端】Web前端学习笔记【2】

    [2016.02.22至今]的学习笔记. 相关博客: Web前端学习笔记[1] 1. this在 JavaScript 中主要有以下五种使用场景 在全局函数调用中,this 绑定全局对象,浏览器环境全 ...

  5. Web前端学习笔记(001)

    ....编号    ........类别    ............条目  ................明细....................时间 一.Web前端学习笔记         ...

  6. web前端学习笔记

    web前端学习笔记(CSS盒子的定位) 相对定位 使用相对定位的盒子的位置常以标准流的排版方式为基础,然后使盒子相对于它在原本的标准位置偏移指定的距离.相对定位的盒子仍在标准流中,它后面的盒子仍以标准 ...

  7. Ext.Net学习笔记19:Ext.Net FormPanel 简单用法

    Ext.Net学习笔记19:Ext.Net FormPanel 简单用法 FormPanel是一个常用的控件,Ext.Net中的FormPanel控件同样具有非常丰富的功能,在接下来的笔记中我们将一起 ...

  8. ensorflow学习笔记四:mnist实例--用简单的神经网络来训练和测试

    http://www.cnblogs.com/denny402/p/5852983.html ensorflow学习笔记四:mnist实例--用简单的神经网络来训练和测试   刚开始学习tf时,我们从 ...

  9. node学习笔记(二)(ajax方式向node后台提交数据)

    通过ajax向node后台提交数据过程(附手写前后台代码),并总结post与get的区别 POST 前台代码 //CSS简单给点样式 <style> form{ width: 200px; ...

随机推荐

  1. 禁止DataGridView控件中添加和删除行

    实现效果: 知识运用: DataGridView控件的AllowUserToAddRows AllowUserDeleteRows和ReadOnly属性 实现代码: private void btn_ ...

  2. Xor Sum

    6498: Xor Sum 时间限制: 1 Sec  内存限制: 128 MB提交: 27  解决: 13[提交][状态][讨论版][命题人:admin] 题目描述 You are given a p ...

  3. mini_httpd的安装和配置

    1.下载:http://www.acme.com/software/mini_httpd/mini_httpd-1.19.tar.gz 2.解压:tar zxvf mini_httpd-1.19.ta ...

  4. VueJS坎坷之路111---_self.$scopedSlots.default is not a function

    VueJs + Element 话不多说,直接贴错: _self.$scopedSlots.default is not a function <el-table stripe border r ...

  5. linux关于任务计划

    1.一次性任务计划:at 1)添加 在18:16时候重启服务器 at 18:16 >at init 6 >at ctrl+d2)查看 atq 1 Mon Aug 20 21:09:00 2 ...

  6. ubuntu中卸载没有安装完全的软件包

    sudo apt-get autoclean sudo apt-get clean sudo apt-get autoremove

  7. sqli-labs less1 &&less3&&less4学习心得

    0x01.less1 id=1/ id=1 and 1=1结果正常 id=1 and 1=2结果正常,不合理 id=1'提示:

  8. jnative 使用

    下载地址: JNative_1.4RC2_src.zip : http://jaist.dl.sourceforge.net/sourceforge/jnative/JNative_1.4RC2_sr ...

  9. 《小团团团队》第九次团队作业:Beta冲刺与验收准备

    项目 内容 这个作业属于哪个课程 任课教师博客主页链接 这个作业的要求在哪里 实验十三 团队作业9:Beta冲刺与团队项目验收 团队名称 小团团团队 作业学习目标 (1)掌握软件黑盒测试技术:(2)学 ...

  10. [转] immutability-helper 插件的基本使用(附源码)

    概念 先理解一下 Immutable 的概念,Immutable数据就是一旦创建,就不能更改的数据.每当对Immutable对象进行修改的时候,就会返回一个新的Immutable对象,以此来保证数据的 ...