Ajax技术实现局部刷新

最新推荐文章于 2023-06-23 10:42:42 发布

原创最新推荐文章于 2023-06-23 10:42:42 发布 · 805 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#Ajax

HTML+CSS 同时被 2 个专栏收录

8 篇文章

订阅专栏

Javascript

2 篇文章

订阅专栏

AJAX技术实现局部刷新，如遇浏览器报错，请看：Cross origin requests are only supported for protocol schemes: http, data, chrome

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script>
function loadXMLDoc()
{
	var xmlhttp;
	if (window.XMLHttpRequest)
	{
		xmlhttp = new XMLHttpRequest();
	}
	else
	{
		xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
	}
	xmlhttp.onreadystatechange=function()
	{
		console.log("ready");
		"文件ajax_info.txt在本地，不需要等待请求及创建状态码"
		"if (xmlhttp.readyState==4 && xmlhttp.status==200)"
		
			document.getElementById("myDiv").innerHTML=xmlhttp.responseText;		
		
	}
	console.log("before changed");
	xmlhttp.open("GET", "ajax_info.txt",true);
	console.log("open file");
	xmlhttp.send();

}

</script>
</head>

<body>
<div id="myDiv"><h2>这里将被修改</h2></div>
<button type="button" onclick="loadXMLDoc()">修改</button>
</body>

</html>