ajax原生js写法
来源:互联网 发布:默默是什么软件 编辑:程序博客网 时间:2024/06/04 20:12
参考
通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。
function loadXMLDoc(){var xmlhttp;if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); }else {// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); }xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById("myDiv").innerHTML=xmlhttp.responseText; } }xmlhttp.open("GET","/ajax/demo_get.asp",true);xmlhttp.send();}
open(method,url,async) ;//规定请求的类型、URL 以及是否异步处理请求。
参数:
method:请求的类型;GET 或 POST
url:文件在服务器上的位置
async:true(异步)或 false(同步)
send(string) 将请求发送到服务器。
参数:
string:仅用于 POST 请求
GET 还是 POST?
与 POST 相比,GET 更简单也更快,并且在大部分情况下都能用。
然而,在以下情况中,请使用 POST 请求:
- 无法使用缓存文件(更新服务器上的文件或数据库)
- 向服务器发送大量数据(POST 没有数据量限制)
- 发送包含未知字符的用户输入时,POST 比 GET 更稳定也更可靠
获得来自服务器的响应,请使用 XMLHttpRequest 对象的 responseText 或 responseXML 属性。
onreadystatechange 存储函数(或函数名),每当 readyState 属性改变时,就会调用该函数。
readyState
存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。
0: 请求未初始化
1: 服务器连接已建立
2: 请求已接收
3: 请求处理中
4: 请求已完成,且响应已就绪
status 200: “OK”
404: 未找到页面
使用回调函数
回调函数是一种以参数形式传递给另一个函数的函数。
如果您的网站上存在多个 AJAX 任务,那么您应该为创建 XMLHttpRequest 对象编写一个标准的函数,并为每个 AJAX 任务调用该函数。
该函数调用应该包含 URL 以及发生 onreadystatechange 事件时执行的任务(每次调用可能不尽相同):
<!DOCTYPE html><html><head><script>var xmlhttp;function loadXMLDoc(url,cfunc){if (window.XMLHttpRequest) {// IE7+, Firefox, Chrome, Opera, Safari 代码 xmlhttp=new XMLHttpRequest(); }else {// IE6, IE5 代码 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); }xmlhttp.onreadystatechange=cfunc;xmlhttp.open("GET",url,true);xmlhttp.send();}function myFunction(){loadXMLDoc("/try/ajax/ajax_info.txt",function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById("myDiv").innerHTML=xmlhttp.responseText; } });}</script></head><body><div id="myDiv"><h2>使用 AJAX 修改文本内容</h2></div><button type="button" onclick="myFunction()">修改内容</button></body></html>
0 0
- ajax原生js写法
- js原生的ajax写法
- 原生js的ajax请求兼容写法
- 原生AJAX写法
- 原生ajax写法
- AJAX原生写法
- ajax的原生写法
- 原生ajax的写法
- js原生和ajax的get和post方法以及jsonp的原生写法
- 原生js封装Ajax
- 原生js实现Ajax
- js原生ajax
- 原生js ajax
- 原生js写ajax
- 原生js实现ajax
- 原生js ajax 实例
- 原生JS实现Ajax
- 原生js实现ajax
- C语言数据类型拾遗
- Android的AlertDialog详解
- poj 3262 贪心比率
- Git 常用命令
- Java - PAT - 1036. 跟奥巴马一起编程(15)
- ajax原生js写法
- thusc2016滚粗记
- sql server 查询出错(校验和失败)
- IOC_@Autowired@Qualifier
- Node.js:使用request模块下载文件
- 补c++上机实验报告1
- VirtualBox——User Manual
- 获取android系统应用
- Iterator接口