版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/qq_30071413/article/details/82688297
<script type="text/javascript">
function loadXMLDoc()
{
var xmlhttp=new XMLHttpRequest();
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","/ajax/something.do",true);
xmlhttp.send();
}
</script>
获得来自服务器的响应,可以使用 XMLHttpRequest 对象的 responseText 或 responseXML 属性,示例代码使用的responseText。两者区别:responseXML支持服务器返回的xml文件,其他文件如json,txt等文件使用responseText
实际上xmlhttp.onreadystatechange=function(){ }这个函数会被触发5次:
- 0: 请求未初始化
- 1: 服务器连接已建立
- 2: 请求已接收
- 3: 请求处理中
- 4: 请求已完成,且响应已就绪
ajax的实际应用:
<script type="text/javascript">
function loadXMLDoc()
{
var xmlhttp=new XMLHttpRequest();
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
}
//获取输入框内容
var str=document.getElementById("Input").value;
xmlhttp.open("GET","/ajax/something.do?id="+str,true);
xmlhttp.send();
}
</script>
开始提交,调用函数,函数获取输入框内容,再和请求uri拼接,向服务器发出请求。当返回状态达到要求,对包含在XMLHttpRequest的数据进行解析,最后更新相关内容。