AJAX数据请求
ajax数据请求需要四个步骤:(请求文本内容)
1.创建XMLHttpRequest对象;
2.打开与服务起的链接;
3.发送给服务器;
4.响应就绪。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>ajax请求数据</title>
</head>
<body>
<button id="btn">请求数据</button>
<h1 id="txt"></h1>
<script type="text/javascript">
var btn = document.getElementById('btn');
var txt = document.getElementById('txt');
btn.onclick = function() {
//1.创建XMLHttpRequest对象
var xhr = null;
if(window.XMLHttpRequest) {//非IE56
xhr = new XMLHttpRequest();//实例对象
}else {//IE56
xhr = new ActiveXObject('Microsoft.XMLHTTP');
}
//2.打开与服务器的链接
xhr.open('get','abc.txt',true);
//3.发送给服务器
xhr.send(null);//get请求
//4.响应就绪
xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {//请求完成
if(xhr.status == 200) {
txt.innerHTML = xhr.responseText;
}else {
alert(xhr.status);
}
}
}
}
</script>
</body>
</html>
AJAX数据请求的更多相关文章
- Ajax --- 数据请求
下面主要介绍(JS原生)数据请求的主要步骤: Ajax 数据请求步骤: 1.创建XMLHttpRequest对象 2.准备数据发送 3.执行发送 4.指定回掉函数 第一步:创建XMLHttpReque ...
- VueJS搭建简单后台管理系统框架 (二) 模拟Ajax数据请求
开发过程中,免不了需要前台与后台的交互,大部分的交互都是通过Ajax请求来完成,在服务端未完成开发时,前端需要有一个可以模拟Ajax请求的服务器. 在NodeJs环境下,通过配置express可访问的 ...
- ajax数据请求5(php格式)
ajax数据请求5(php格式): <!DOCTYPE html> <html> <head> <meta charset="UTF-8" ...
- ajax数据请求4(xml格式)
ajax数据请求4(xml格式): <!doctype html> <html> <head> <meta charset="utf-8" ...
- ajax数据请求3(数组json格式)
ajax数据请求3(数组json格式) <!doctype html> <html> <head> <meta charset="utf-8&quo ...
- ajax数据请求2(json格式)
ajax数据请求2(json格式) <!DOCTYPE html> <html> <head> <meta charset="UTF-8" ...
- 微信小程序的ajax数据请求wx.request
微信小程序的ajax数据请求,很多同学找不到api在哪个位置,这里单独把小程序的ajax请求给列出来,微信小程序的请求就是wx.request这个api,wx.request(一些对象参数),微信小程 ...
- ajax数据请求的理解
一,请求 发送请求有两种方式:get 跟 post . 1.get仅请求数据,不需要服务端做处理,最后会返回指定的资源. 2.post可以提交数据,服务端根据提交的数据做处理,再返回数据. 二,创建X ...
- ajax 数据请求(一)同域
参考:http://www.css88.com/jqapi-1.9/jQuery.ajax/ http://www.cnblogs.com/haitao-fan/p/3908973.html 1.常用 ...
随机推荐
- web基础之会话技术
一.会话技术之Cookie Cookie技术是将数据存储到客户端 1.怎样去向客户端写出一个cookie 1)创建Cookie对象 Cookie cookie = new Cookie(name,va ...
- SQL server 用命令行更改数据库
(计应154兰家才) CREATE DATABASE 数据库名 ON [PRIMARY] ( <数据文件参数> [,…n] [<文件组参数>] ) [LOG ON] ( ...
- CoreOS, Kubernetes, etcd
CoreOS CoreOS Container Linux is the leading container operating system, designed to be managed and ...
- html学习笔记 - table表格
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 纯css实现多标签浮动居中(任意个数)
在做的一个网页上有一块要用浮动标签,具体就是网页底部有未知数量,未知尺寸的元素要水平居中,有点类似于分页器. 首先,我们先新建一个容器con,就是标签的爸爸,用来控制标签在页面的位置,.father{ ...
- kafka 0.10.2 消息消费者
package cn.xiaojf.kafka.consumer; import org.apache.kafka.clients.consumer.ConsumerConfig; import or ...
- 如何在Java中调用Python代码
有时候,我们会碰到这样的问题:与A同学合作写代码,A同学只会写Python,而不会Java, 而你只会写Java并不擅长Python,并且发现难以用Java来重写对方的代码,这时,就不得不想方设法“调 ...
- 总结scala(一)
由于笔记太多,分为了几部分,进入我的博客,查看其它的笔记 scala:面向对象,函数式编程 一.声明变量 1.变量的类型 Byte,Char,Short,Int,Long,Float,Double,B ...
- Unity User Group 北京站:《Unity5.6新功能介绍以及HoloLens开发》
时间一转眼从春天来到了初夏,Unity User Group(以下简称UUG)活动也迎来了第七期.我们面向Unity3D开发从业者以及未来想从事Unity3D开发的学生群体的UUG活动这次仍然在海淀 ...
- python——爬虫&问题解决&思考(四)
继续上一篇文章的内容,上一篇文章中已经将url管理器和下载器写好了.接下来就是url解析器,总的来说这个模块是几个模块中比较难的.因为通过下载器下载完页面之后,我们虽然得到了页面,但是这并不是我们想要 ...