get和post的区别:
1.GET产生一个TCP数据包;POST产生两个TCP数据包。
  对于GET方式的请求,浏览器会把http header和data一并发送出去,服务器响应200(返回数据);
  而对于POST,浏览器先发送header,服务器响应100 continue,浏览器再发送data,服务器响应200 ok(返回数据)。
2.get请求数据有限制,post请求数据没有限制
3.请求参数在url中发送,post请求参数在http消息主体中发送

    //get
function get() {
//创建XMLHttpRequest
  let xhr = new XMLHttpRequest();
//监听响应
  xhr.onreadystatechange = function () {
    if (xhr.readyState === 4 && (xhr.status === 200 || xhr.status === 304)) {
      console.log(xhr.responseText);
    }
  };
  xhr.open("GET","your url",true);
  xhr.send();
} //post
function post () {
//请求参数、url、创建XMLHttpRequest
  let data = 'name=tom&age=18',
    url = 'your url',
    xhr = new XMLHttpRequest();   xhr.open('post', url);
//设置header
  xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
  xhr.send(data);
  xhr.onreadystatechange = function () {
    if (xhr.readyState === 4 && ( xhr.status === 200 || xhr.status === 304 )){
      console.log(xhr.responseText);
    }
  }
}

参考:1.https://blog.csdn.net/u012391923/article/details/53197387?utm_source=blogxgwz3
   2.http://www.runoob.com/tags/html-httpmethods.html

js 实现ajax(get和post)的更多相关文章

  1. Vue.js——基于$.ajax实现数据的跨域增删查改

    概述 之前我们学习了Vue.js的一些基础知识,以及如何开发一个组件,然而那些示例的数据都是local的.在实际的应用中,几乎90%的数据是来源于服务端的,前端和服务端之间的数据交互一般是通过ajax ...

  2. Jquery学习笔记 --ajax删除用户,使用了js原生ajax

    主要复习了php的pdo数据库操作,和js的ajax,真麻烦,希望jquery的ajax简单点. index.php: 1 <!DOCTYPE html> 2 <html lang= ...

  3. 分享一个基于长连接+长轮询+原生的JS及AJAX实现的多人在线即时交流聊天室

    实现网页版的在线聊天室的方法有很多,在没有来到HTML5之前,常见的有:定时轮询.长连接+长轮询.基于第三方插件(如FLASH的Socket),而如果是HTML5,则比较简单,可以直接使用WebSoc ...

  4. 原生js实现Ajax

    一般来说,大家可能都会习惯用JQuery提供的Ajax方法,但是用原生的js怎么去实现Ajax方法呢? JQuery提供的Ajax方法: $.ajax({ url: , type: '', dataT ...

  5. 浅谈JS之AJAX

    0x00:什么是Ajax? Ajax是Asynchronous Javascript And Xml 的缩写(异步javascript及xml),Ajax是使用javascript在浏览器后台操作HT ...

  6. Atitit   发帖机实现(3 )---usrQBN023 js提交ajax内容到后端规范与标准化

    Atitit   发帖机实现(3 )---usrQBN023 js提交ajax内容到后端规范与标准化 大段内容务必要替换转义换行符号1 提交务必使用utf编码,否则解码后的可能缺失,是web serv ...

  7. prototype.js 和 jQuery.js中 ajax 的使用

    这次还是prototype.js 和 jQuery.js冲突的问题,前面说到过解决办法http://www.cnblogs.com/Joanna-Yan/p/4836252.html,以及上网说的大部 ...

  8. Intercooler.js – 让 AJAX 像锚标签一样简单

    使用 Intercooler,你可以添加 Ajax 到你的应用程序,而无需使用客户端模式的路由,认证,渲染,工厂或依赖注入.事实上,你不需要写任何的 JavaScript 代码.Intercooler ...

  9. 使用原生JS封装Ajax

    使用原生 的JS封装 Ajax,实现 仿JQuery的Ajax,post,get三种异步请求方式: var MAjax = { //根据浏览器创建异步对象 createXhr: function () ...

  10. JS实现Ajax,Josn数据的序列化和反序列化---例: 省市区联动(包含get,post)

    服务器端相应JOSN数据   用到序列化和反序列化----命名空间using System.Web.Script.Serialization; public void ProcessRequest(H ...

随机推荐

  1. HNOI2017

    本蒟蒻表示终于把$HNOI2017$全AC了... 万岁! 附上各个题的题解: $DAY1$: $T1$: BZOJ4825: [Hnoi2017]单旋 $T2$: BZOJ4826: [Hnoi20 ...

  2. 一起来学linux:网络配置

    上网首先需要网卡的支持.在linux中默认的网卡为eth0, 第二张网卡为eth1.如果是用的无线网卡则是wlan0.这个可以通过ifconfig查看到.结果如下.其中lo代表本地端口.root@zh ...

  3. T_CODE I18N

    关于T-CODE I18N 最近由于看到很多人遇到SMARTFORMS不能拖拽字段的问题,这个的解决方案 I18N:解决SMARTFORMS的不能从Field name 那边直接把变量拖入右边编辑框 ...

  4. JavaScript学习笔记(持续更新)

    函数有“定义式”和“变量式”两种写法的区别 函数有“定义式”和“变量式”两种写法,两者基本区别不大.主要区别在于,如果在同一个代码块(Script标签对)定义两个同名的函数,浏览器在预编译代码时,使用 ...

  5. 第一个Vert.x程序

    Jar依赖 <dependency> <groupId>io.vertx</groupId> <artifactId>vertx-core</ar ...

  6. Redmine后台修改admin密码

    Redmine后台修改admin密码 进入redmine安装目录,假设redmine安装在/var/www/html/redmine/目录下. cd /var/www/html/redmine/scr ...

  7. initcall_debug简要说明【转】

    本文转载自:https://blog.csdn.net/zangdongming/article/details/37769265 Linux version 3.10.40 1. 使用说明 Docu ...

  8. 《机器学习实战》学习笔记第二章 —— K-近邻算法

    主要内容: 一.算法概述 二.距离度量 三.k值的选择 四.分类决策规则 五.利用KNN对约会对象进行分类 六.利用KNN构建手写识别系统 七.KNN之线性扫描法的不足 八.KD树 一.算法概述 1. ...

  9. PYTHON 爬虫笔记七:Selenium库基础用法

    知识点一:Selenium库详解及其基本使用 什么是Selenium selenium 是一套完整的web应用程序测试系统,包含了测试的录制(selenium IDE),编写及运行(Selenium ...

  10. jsonp跨域请求,动态script标签实现跨域

    1.什么是跨域 首先一个域名地址的组成是: http://www.xxx.com:8080/xxx/xxx.jsp 协议子域名主域名端口号请求资源地址 当协议.子域名.主域名.端口号中任意一个不相同时 ...