用原生javascript实现get请求,及具体数据的获取

function productClickHandler() {
    var xhr = new XMLHttpRequest(); // 创建xhr对象
    xhr.onreadystatechange = function() {
        if(xhr.readyState == 4) {
            if((xhr.status >= 200 && xhr.status < 300) || xhr.status == 304) {
                var result = JSON.parse(xhr.responseText); // 将字符串转化为对象,然后才能获取到返回字符串中的某一个值
                console.log(result.totalCount); // 获取返回字符串中的某一个值
            } else {
                alert('Request was unsuccessful: ' + xhr.status);
            }
        }
    }
    var url = 'http://study.163.com/webDev/couresByCategory.htm?' + "pageNo=1&psize=1&type=10"; // 获取课程列表,带参数的get请求
    xhr.open('get', url, true); // 开启一个请求,但还没有向服务器端发起请求,执行后redayState的值变为1
    xhr.send(null); // 向服务器端发起请求,执行后redayState的值变为2
// 补充:当服务器端开始返回请求数据的时候,浏览器端接收到这个数据,redayState的值变为3。
// 当浏览器端结束请求时,redayState的值变为4,status的值变为200(表示请求成功),responseText变为相应的返回值。
}

 然后可以通过getElementById("id")等方法获取到html元素,再使用.innerHTML将获取到的值插入html。

转载于:https://www.cnblogs.com/liyan22/p/6581601.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值