原生 JS Ajax,GET和POST 请求实例代码
javascript/js的ajax的GET请求代码如下所示:
<script type="text/javascript">
/* 创建 XMLHttpRequest 对象 */
var xmlHttp;
function GetXmlHttpObject(){
if (window.XMLHttpRequest){
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}else{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
return xmlhttp;
}
// -----------ajax方法-----------//
function getLabelsGet(){
xmlHttp=GetXmlHttpObject();
if (xmlHttp==null){
alert('您的浏览器不支持AJAX!');
return;
}
var id = document.getElementById('id').value;
var url="http://www.Leefrom.com?id="+id+"&t/"+Math.random();
xmlHttp.open("GET",url,true);
xmlHttp.onreadystatechange=favorOK;//发送事件后,收到信息了调用函数
xmlHttp.send();
}
function getOkGet(){
if(xmlHttp.readyState==1||xmlHttp.readyState==2||xmlHttp.readyState==3){
// 本地提示:加载中
}
if (xmlHttp.readyState==4 && xmlHttp.status==200){
var d= xmlHttp.responseText;
// 处理返回结果
}
}
</script>
javascript/js的ajax的POST请求:
<script type="text/javascript">
/* 创建 XMLHttpRequest 对象 */
var xmlHttp;
function GetXmlHttpObject(){
if (window.XMLHttpRequest){
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}else{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
return xmlhttp;
}
// -----------ajax方法-----------//
function getLabelsPost(){
xmlHttp=GetXmlHttpObject();
if (xmlHttp==null){
alert('您的浏览器不支持AJAX!');
return;
}
var url="http://www.lifefrom.com/t/"+Math.random();
xmlhttp.open("POST",url,true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send();
xmlHttp.onreadystatechange=getLabelsOK;//发送事件后,收到信息了调用函数
}
function getOkPost(){
if(xmlHttp.readyState==1||xmlHttp.readyState==2||xmlHttp.readyState==3){
// 本地提示:加载中/处理中
}
if (xmlHttp.readyState==4 && xmlHttp.status==200){
var d=xmlHttp.responseText; // 返回值
// 处理返回值
}
}
</script>
注意:XMLHttpRequest 是 AJAX 的基础,在创建 XMLHttpRequest 对象时,必须与你写的ajax方法在同一个‘<script></script>'标签中!否则ajax请求会出错,并无法返回数据。 javascript/js的ajax的POST/GET请求。
原生 JS Ajax,GET和POST 请求实例代码的更多相关文章
- 原生js ajax与jquery ajax的区别
原生js ajax的调用: ajax({ type : "get", url : "02_ajax_get.txt", data : { "userN ...
- 原生js实现文件下载并设置请求头header
原生js实现文件下载并设置请求头header const token="自行定义";//如果有 /** * 向指定路径发送下载请求 * @param{String} url 请求路 ...
- 用原生 JS 实现双向绑定及应用实例
写在前面: 所谓的双向绑定,无非是从界面的操作能实时反映到数据,数据的变更也能实时展现到界面.angular封装了双向绑定的方法,使双向绑定变得十分简单.但是在有些场景下(比如下面那个场景),不能使用 ...
- 新浪博客:html+css+原生JS+Ajax初级+mySql数据库——源码
**************************************************************************************************** ...
- jquery ajax jsonp跨域调用实例代码
今天研究了AJAX使用JSONP进行跨域调用的方法,发现使用GET方式和POST方式都可以进行跨域调用,这里简单分享下,方便需要的朋友 客户端代码 复制代码 代码如下: <%@ Page Lan ...
- 原生js仿淘宝手机购买选项代码
这是一款基于原生js实现仿淘宝手机信息购买选项效果源码,界面整体效果仿照淘宝购物选项设计,点击不同选项还可实时显示不同的价格计算结果,界面简洁大方.美观实用.可兼容目前最新的各类主流浏览器. 在线演示 ...
- 原生js ajax请求
什么是ajax AJAX 是一种用于创建快速动态网页的技术. 通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新. 这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新, ...
- 原生JS Ajax 请求
var username = document.getElementById('username').value; var password = document.getElementById('pa ...
- 原生js ajax 封装
首先我们先了解ajax的get和post请求分别是怎样请求数据的 get请求 let ajx = new XMLHttpRequest() //创建ajax实例 /*打开需要请求的地址,可以有三个参数 ...
随机推荐
- @font-face的用法
几乎所有浏览器(包括最古老的IE6)也支持的网络字体@font-face的用法是: @font-face { font-family: 'MyWebFont'; src: url('webfont.e ...
- HAProxy与varnish
Even if HAProxy can do TCP proxying, it is often used in front of web application, exactly where we ...
- MySQL-测试卷一
MySQL-测试卷一 一.单项选择题 1 下面不属于Msql数据库特点的是( ) A. 免费使用 B.不能跨平台 C.开源软件 D.功能强大 2 定义表的一个字段, 要求能表示4位整数,2位小 ...
- UnicodeEncodeError: 'ascii' codec can't encode characters in position 14-15: ordinal not in range(128)
python在安装时,默认的编码是ascii,当程序中出现非ascii编码时,python的处理常常会报类似这样的错误. UnicodeEncodeError: 'ascii' codec can't ...
- 关于项目刚才还能运行的,重启Myeclipse就不能运行(报错)的解决方法
这个是以为内存不足引起的,就是打开MyEclipse的时候,因为内存不足,没有加载完整的项目,这个时候需要重启电脑,即可解决问题.
- jsp提交表单问题
以form形式提交的话 String usernameInForm = hreq.getParameter("username");String passwordInForm = ...
- 【多重背包模板】poj 1014
#include <iostream> #include <stdio.h> #include <cstring> #define INF 100000000 us ...
- Checking the Calendar
Checking the Calendar time limit per test 1 second memory limit per test 256 megabytes input standar ...
- apicloud本地测试安卓测试包安装
1.liutingdeMacBook-Pro:~ js-lt$ which adb 2.liutingdeMacBook-Pro:~ js-lt$ ls 3.liutingdeMacBook-Pro: ...
- translucent 属性
<pre name="code" class="objc">//适配ios7 if( ([[[UIDevice currentDevice] sys ...