JS深入(Ajax)

作者: 余生筑 | 来源:发表于2017-09-15 20:13 被阅读0次

Ajax的完整请求过程

1. 创建Ajax对象

2.连接到服务器

3.发送请求

4.接收返回值

read.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <input type="button"  id="btn" value="读取">
    <script>
        var obtn=document.getElementById("btn")

        //创建Ajax对象
        obtn.onclick=function(){
            var oAjax=new XMLHttpRequest()

        //连接服务器
        oAjax.open('GET','a.txt?t='+new Date().getTime(),true)//+new Date().getTime()用于保证a.text实时更新。true表示"异步传输"

        //发送请求
        oAjax.send()

        //接收返回
        oAjax.onreadystatechange=function(){
        if(oAjax.readyState==4){ //响应内容解析完毕
        if(oAjax.status==200){//解析成功
            alert(oAjax.responseText)
        }  
        else{
            alrt('s')
        }
    }
}
}
</script>
</body>
</html>

a.txt

abcsdfgh

相关文章

  • JS深入(Ajax)

    Ajax的完整请求过程 1. 创建Ajax对象 2.连接到服务器 3.发送请求 4.接收返回值 read.html...

  • Js 深入理解Ajax

    ajax的工作原理: ajax的工作原理相当于在用户和服务器之间加了一个中间层(ajax引擎) ,使用 户操作与服...

  • JS中的Ajax

    JS中的Ajax Ajax简介 Ajax为 Asynchronous Javascript And XML 的缩写...

  • 封装ajax

    利用npm安装axios 在src目录下创建ajax.jsajax.js 将ajax.js 文件引入main.js...

  • ajax的封装-ajax.js

    ajax.js:

  • [转]JS原生Ajax代码示例

    文章来源: JS原生Ajax和jQuery的Ajax与代码示例 -- 苏凯勇往直前 JS原生的Ajax其实就是围绕...

  • Go Json 操作

    js ajax请求时

  • Ajax笔记整理

    Ajax是什么 AJAX = Asynchronous JavaScript and XMLajax即为js通过异...

  • Ajax和跨域总结

    Ajax(JavaScript实现) 简介 Ajax(Async Javascript And Xml):异步Js...

  • 关于原生JS的AJAX

    一、什么是AJAX?以及AJAX诞生缘由 什么是AJAX? AJAX全称是异步JS和XML(Asynchronou...

网友评论

    本文标题:JS深入(Ajax)

    本文链接:https://www.haomeiwen.com/subject/ptdesxtx.html