【JavaScript】用原生js如何写ajax请求

变量和属性

alert(a) //报错 a is not defined
alert(window.a) //undefined

全局变量是 window 的一个属性

未定义的变量,使用会报错

未定义的属性,使用时值是 undefined

ajax 请求

function ajax(url, fnSucc, fnFaild) {
	//1、创建Ajax对象
	if (window.XMLHttpRequest) {
		var oAjax = new XMLHttpRequest()
	} else {
		var oAjax = new ActiveXObject("Microsoft.XMLHTTP") //为了兼容 ie6
	}
	//2、连接服务器
	oAjax.open('GET', url, true)
	//3、发送请求
	oAjax.send()
	//4、接收返回值
	oAjax.onreadystatechange = function () {
		if (oAjax.readyState == 4) {
			if (oAjax.status == 200) {
				fnSucc(oAjax.responseText)
			} else {
				if(fnFaild){
					fnFaild(oAjax.status)
				}
			}
		}
	}
}
<body>
    <input type="button" value="读取" id="btn">
    <hr>
    <ol> //oAjax.readyState
        <li>0 (为初始化)还没有调用open()方法</li>
        <li>1 (载入)已调用send()方法,正在发送请求</li>
        <li>2 (载入完成)send()方法完成,已收到全部响应内容</li>
        <li>3 (解析)正在解析响应内容</li>
        <li>4 (完成)响应内容解析完成,可以在客户端调用了</li>
    </ol>
<script>
    window.onload = function(){
        var oBtn = document.getElementById('btn')
        oBtn.onclick = function(){
            ajax('aaa.txt?t=' + Date.now(), function(data){
                alert(data)
            })
        }
    }
</script>
</body>

猜你喜欢

转载自blog.csdn.net/meichaoWen/article/details/113623036