Ajax起步

前端之家收集整理的这篇文章主要介绍了Ajax起步前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

Ajax的关键在于XMLHttpRequest对象,理解这个对象的例子如下:

<!DOCTYPE HTML>

<html>

<head>

<title>Ajax</title>

</head>

<body>

<div>

<button>Apple</button>

<button>Samsung</button>

<button>IBM</button>

</div>

<div id="target">

Press a button

</div>

<script>

var buttons = document.getElementsByTagName("button");

for(var i = 0; i < buttons.length; i++){

buttons[i].onclick = handleButtonPress;

}

function handleButtonPress(e){

var httpRequest = new XMLHttpRequest();

httpRequest.onreadystatechange = handleResponse;

httpRequest.open("GET",e.target.innerHTML + ".html");

httpRequest.send();

}

function handleResponse(e){

if(e.target.readyState == XMLHttpRequest.DONE &&

e.target.status == 200){

document.getElementById("target").innerHTML

= e.target.responseText;

}

}

</script>

</body>

</html>

猜你在找的Ajax相关文章