XMLHttpRequest
来源:互联网 发布:石狮淘宝运营培训 编辑:程序博客网 时间:2024/06/03 13:04
1.如何从javascript做出请求
<!DOCTYPE html><html><head> <title>地理定位跟踪</title></head><body><h1>销售数据列表</h1><div id="sales"></div></body><script type="text/javascript"> /* 如何从javascript做出请求 */ window.onload = function(){ var url = "http://localhost/sales.json"; // 使用XMLHttpRequest构造函数创建一个新的请求对象 var request = new XMLHttpRequest(); request.onload = function(){ if (request.status == 200) { // console.log("请求成功"); // console.log(request.responseText); updateSales(request.responseText); } }; // 使用HTTP GET是获取HTTP数据的标准方法 request.open("GET",url); // 这里把请求发送到服务器,如果不打算向远程服务器发送任何数据,就要传入null request.send(null); } // 把请求返回来的数据展示到页面 function updateSales(responseText){ var salesDiv = document.getElementById("sales"); // 因为我这里取回来的数据是一个JSON字符串,需要转换为一个真正的JS对象 var sales = JSON.parse(responseText); // console.log(sales); // 遍历所得到的数组,向DOM增加新元素 for(var i=0;i<sales.length;i++){ var sale = sales[i]; var div = document.createElement("div"); div.setAttribute("class","saleItem"); div.innerHTML = sale.name + "==>" + sale.time + "==>" + sale.sales; salesDiv.appendChild(div); } }</script></html>
sales.json:
[ {"name":"ARTESIA","time":1308774240669,"sales":8}, {"name":"LOS","time":1308774240669,"sales":2}, {"name":"PASADENA","time":1308774240669,"sales":8}, {"name":"STOCKTON","time":1308774240669,"sales":2}, {"name":"FRESNO","time":1308774240669,"sales":2}]
2.较老的浏览器不支持XMLHttpRequest onload属性
我们使用request.onload定义了一个函数,从服务器获取数据的请求完成时就会调用这个函数。这是XMLHttpRequest Level 2的一个特性,XMLHttpRequest Level2还相当新,所以很多浏览器可能还不支持,你还可以继续使用版本1的特性:
function init (){ var url = "http://localhost/sales.json"; var request = new XMLHttpRequest(); request.onreadystatechange = function(){ if (request.readyState == 4 && request.status == 200) { updateSales(request.responseText); } }; request.open("GET",url); request.send(null); }
3.IE 8-
在IE9以前,IE浏览器没有XMLHttpRequest对象,而是ActiveXObject和XDomainRequest。关于这2个,这里不作详解。
0 0
- XMLHttpRequest
- XMLHttpRequest
- XMLHTTPRequest
- XMLHTTPRequest
- XMLHttpRequest
- XMLHttpRequest
- XMLHttpRequest
- XMLHttpRequest
- xmlhttprequest
- XMLHttpRequest
- XMLHttpRequest
- xmlhttprequest
- XMLHttpRequest
- XMLHttpRequest
- XMLHttpRequest
- XMLHttpRequest
- XMLHttpRequest
- XMLHttpRequest
- Java中的四种内部类
- 十二、备忘录设计模式
- 计算n的阶乘
- android通过servlet上传文件到服务器
- strftime()的问题,新搭建的环境
- XMLHttpRequest
- 在文本的行首或行尾加字符
- 生活、学习、职业和未来
- 利用Pybrain库进行神经网络函数拟合
- android数据库配置和操作
- struts2基本介绍以及环境配置
- POJ 网络流题集(转)
- hdu3527 SPY 水题
- Unreal Engine 4 —— 可交互绳索的构建