Ajax的基本概念和使用方法02

最新推荐文章于 2024-08-12 09:24:46 发布

我才是丶丶丶天使

最新推荐文章于 2024-08-12 09:24:46 发布

阅读量111

点赞数

分类专栏： javascript 文章标签： ajax javascript

本文链接：https://blog.csdn.net/weixin_43338566/article/details/105604440

版权

javascript 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

前情摘要：在本次实验中采取了js代码和HTML分离的方式。文件夹中一共有五个文件：HTML文档、三个js文件、以及一个txt文件。
HTML文件如下：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>Ajax02</title>
		<script src="addLoadEvent.js" type="text/javascript" charset="utf-8"></script>
		<script src="Ajax02.js" type="text/javascript" charset="utf-8"></script>
		<script src="getnewcontent.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<input type="button"  id="btn1" value="读取" />
	</body>
	
</html>

addLoadEvent.js文件如下：

function addLoadEvent(func){
	var oldοnlοad=window.onload;
	if(typeof window.onload!='function'){
		window.οnlοad=func;
	}
	else{
		window.οnlοad=function(){
			oldonload();
			func();
		}
	}
}

Ajax02.js文件如下图所示：

function ajax(url)
{
	// 1.创建Ajax对象
	if(window.XMLHttpRequest)
	var oAjax=new XMLHttpRequest();
	else
	var oAjax=new ActiveXObject("Microsoft.XMLHTTP");
	// 2.连接服务器
	oAjax.open('GET',url,true);
	// 3.发送请求
	oAjax.send();
	// 4.接受返回
	oAjax.onreadystatechange=function()
	{
		if(oAjax.readyState==4)
		{
			if(oAjax.status==200)
			{
				alert(oAjax.responseText);
				// alert(oAjax.status);
			}
			else
			alert('请求失败');
		}
	};
}

getnewcontent.js如下图所示：

function getnewcotent()
{
	var oBtn=document.getElementById('btn1');
	oBtn.οnclick=function()
	{
		ajax('show03.txt');
		// ajax('show03.txt',function(str){
		// 	alert(str);
		// });
	};
}
addLoadEvent(getnewcotent);

问题：当url路径上没有文件存在的时候，Ajax02.js文件中的代码alert(‘请求失败’);并没有按照计划中的那样弹出一个窗口告知我们：请求失败！这是为什么呢？

我才是丶丶丶天使

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Ajax的基本概念和使用方法02

前情摘要：在本次实验中采取了js代码和HTML分离的方式。文件夹中一共有五个文件：HTML文档、三个js文件、以及一个txt文件。HTML文件如下：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>Ajax02</title> <sc...
复制链接

扫一扫

专栏目录