编写Ajax

变量和属性

  • 用没有定义的变量——报错
  • 用没有定义的属性——undefined
alert(window.a);

编写Ajax

  1. 创建Ajax对象
    XMLHttpRequest()

  2. 连接服务器
    open(方法, 文件名, 异步传输)
    同步和异步
    同步:事情一件一件来
    异步:多个事件一起做

  3. 发送请求
    send()

  4. 请求状态监控

    onreadystatechange事件

    readyState属性:请求状态
    0 (未初始化)还没有调用open()方法
    1 (载入)已调用send()方法,正在发送请求
    2 (载入完成)send()方法完成,已收到全部响应内容
    3 (解析)正在解析响应内容
    4 (完成)响应内容解析完成,可以在客户端调用了

    status属性:请求结果

    responseText

function ajax(url, fnSucc, fnFaild)
{
	//1.创建Ajax对象
	var oAjax=new XMLHttpRequest();
	
	//2.连接服务器
	//open(方法, 文件名, 异步传输)
	oAjax.open('GET', url, true);
	
	//3.发送请求
	oAjax.send();
	
	//4.接收返回
	oAjax.onreadystatechange=function ()
	{
		//oAjax.readyState	//浏览器和服务器,进行到哪一步了
		if(oAjax.readyState==4)	//读取完成
		{
			if(oAjax.status==200)	//成功
			{
				fnSucc(oAjax.responseText);
			}
			else
			{
				if(fnFaild)
				{
					fnFaild(oAjax.status);
				}
				//alert('失败:'+oAjax.status);
			}
		}
	};
}

使用:

<script src="new_ajax.js"></script>
<script>
window.onload=function ()
{
	var oBtn=document.getElementById('btn1');
	
	oBtn.onclick=function ()
	{
		ajax('a.txt', function (str){
			alert(str);
		});
	};
};
</script>
</head>

<body>
<input id="btn1" type="button" value="读取" />
</body>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
经导师精心指导并认可、获 98 分的毕业设计项目!【项目资源】:微信小程序。【项目说明】:聚焦计算机相关专业毕设及实战操练,可作课程设计与期末大作业,含全部源码,能直用于毕设,经严格调试,运行有保障!【项目服务】:有任何使用上的问题,欢迎随时与博主沟通,博主会及时解答。 经导师精心指导并认可、获 98 分的毕业设计项目!【项目资源】:微信小程序。【项目说明】:聚焦计算机相关专业毕设及实战操练,可作课程设计与期末大作业,含全部源码,能直用于毕设,经严格调试,运行有保障!【项目服务】:有任何使用上的问题,欢迎随时与博主沟通,博主会及时解答。 经导师精心指导并认可、获 98 分的毕业设计项目!【项目资源】:微信小程序。【项目说明】:聚焦计算机相关专业毕设及实战操练,可作课程设计与期末大作业,含全部源码,能直用于毕设,经严格调试,运行有保障!【项目服务】:有任何使用上的问题,欢迎随时与博主沟通,博主会及时解答。 经导师精心指导并认可、获 98 分的毕业设计项目!【项目资源】:微信小程序。【项目说明】:聚焦计算机相关专业毕设及实战操练,可作课程设计与期末大作业,含全部源码,能直用于毕设,经严格调试,运行有保障!【项目服务】:有任何使用上的问题,欢迎随时与博主沟通,博主会及时解答。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值