1.布局
<h2>ajax</h2>
<button type="button" onclick="LoadText()">请求数据</button>
<div id="mydiv"></div>
2.js函数
<script type="text/javascript">
function LoadText()
{
var xmlhttp;
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
}
else {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function ()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200){
document.getElementById("mydiv").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET","/ajax/HtmlPage1.html",true);
xmlhttp.send();
}
</script>
3.前提是路径下有"/ajax/HtmlPage1.html",这个html
4.全部html
<!DOCTYPE html>
<html >
<head>
<Meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script type="text/javascript">
function LoadText()
{
var xmlhttp;
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
}
else {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function ()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200){
document.getElementById("mydiv").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET",true);
xmlhttp.send();
}
</script>
</head>
<body>
<h2>ajax</h2>
<button type="button" onclick="LoadText()">请求数据</button>
<div id="mydiv"></div>
</body>
</html>