|
|
dynamicContent.html
例子来源：《Ajax 基础教程》 金灵 等译 这本书非常不错
<html><head><title>Dynamically Editing Page Content</title><script>var xmlHttp;function createXMLHttpRequest() {if (window.ActiveXObject) {xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");}else if (window.XMLHttpRequest) {xmlHttp = new XMLHttpRequest();}}function doSearch() {createXMLHttpRequest();xmlHttp.onreadystatechange = handleStateChange;xmlHttp.open("GET", "dynamicContent.xml", true);xmlHttp.send(null);}function handleStateChange() {if(xmlHttp.readyState == 4) {if(xmlHttp.status == 200) {clearPreviousResults();parseResults();}}}function clearPreviousResults() {var header = document.getElementById("header");if(header.hasChildNodes()) {header.removeChild(header.childNodes[0]);}var tableBody = document.getElementById("resultsBody");while(tableBody.childNodes.length > 0) {tableBody.removeChild(tableBody.childNodes[0]);}}function parseResults() {var results = xmlHttp.responseXML;var property = null;var address = "";var price = "";var comments = "";var properties = results.getElementsByTagName("property");for(var i = 0; i< properties.length; i++) {property = properties[i];address = property.getElementsByTagName("address")[0].firstChild.nodeValue;price = property.getElementsByTagName("price")[0].firstChild.nodeValue;comments = property.getElementsByTagName("comments")[0].firstChild.nodeValue;addTableRow(address, price, comments);}var header = document.createElement("h2");var headerTest = document.createTextNode("Results:");header.appendChild(headerTest);document.getElementById("header").appendChild(header);document.getElementById("resultsTable").setAttribute("border", "1");}function addTableRow(address, price, comments) {var row = document.createElement("tr");var cell = createCellWithText(address);row.appendChild(cell);cell = createCellWithText(price);row.appendChild(cell);cell = createCellWithText(comments);row.appendChild(cell);document.getElementById("resultsBody").appendChild(row);}function createCellWithText(text) {var cell = document.createElement("td");var textNode = document.createTextNode(text);cell.appendChild(textNode);return cell;}</script></head><body><form action="#"><input type="button" value="Serrch" /><input type="button" value="Clearn" /></form><span id="header"></span><table id="resultsTable" width="75%" border="0"><tbody id="resultsBody"></tbody></table></body></html>
dynamicContent.xml
<?xml version="1.0" encoding="UTF-8"?><properties><property><address>812 Gwyn Ave</address><price>$100,000</price><comments>Queet, serene neighborhood</comments></property><property><address>3308 James Ave S</address><price>$110,000</price><comments>Close to schools, shopping, entertainment</comments></property><property><address>98320 County Rd 113</address><price>$115,000</price><comments>Small acreage outside of town</comments></property></properties> |
|
京ICP备14020293号-2
本网站内容均收集于互联网，如有问题请联系QQ:389897944予以删除
窥视卡
雷达卡
楼主
提升卡
置顶卡
沉默卡
喧嚣卡
变色卡
千斤顶
显身卡