AJAX? XML

AJAX ? XML ?:

?? ?? ? ???? AJAX? ?? XML ???? ??? ?? ??? ?????.

? ?? ? ???? ?????.

l HTML ?? ???

l PHP ???

l XML ??

HTML ?? ???

???? ? ???? ???? CD? ???? "showCD()"?? ??? ?????. ? ??? "onchange" ???? ?? ??????:

QQ截圖20161009174933.png

???? ????? ??? ? ??. showCD() ??

ShowCD() ??? ???? ?? ??? ?????.

l CD? ?????? ??

l XMLHttpRequest ?? ??

l ?? ??? ???? ?? ??

l ??? ??? ?? ???

l URL ?? ??? ????(q)? ?????( ???? ?? ?? ??)

PHP ??

??? JavaScript? ?? ???? ?? ???? "2.php"?? ??? PHP ?????.

PHP ????? XML ?? "3.xml"? ???? XML ??? ?? ??? ??? ? ??? HTML? ?????.

QQ截圖20161009174957.png

CD ??? JavaScript?? PHP ???? ???? ?? ?? ??????

l PHP? "3.xml? XML DOM ??? ?????. " ??

l ?? "artist" ??(nodetypes = 1)? ???? JavaScript? ??? ???? ???? ??? ????.

l CD? ??? ??? ????? ????.

l ?? ??? ???? "txtHint" ?? ???

XML ??

QQ截圖20161009175012.png

CD ???? ?? ???? ??? ??

???? ??

??? ??

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script> function showCD(str){ if(str==""){ document.getElementById("txt").innerHTML=""; return; } if(window.XMLHttpRequest){ // IE7+, Firefox, Chrome, Opera, Safari 瀏覽器執(zhí)行 xmlhttp=new XMLHttpRequest(); }else{ //IE6,IE5瀏覽器執(zhí)行 xmlhttp =new ActiveXObject("MIcrosoft.XMLHTTP"); } xmlhttp.onreadystatechange=function(){ if(xmlhttp.readyState==4&&xmlhttp.status==200){ document.getElementById("txt").innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET","8_2.php?q="+str,true); xmlhttp.send(); } </script> </head> <body> <form> 選擇一個(gè)CD： <select name="cds" onchange="showCD(this.value)"> <option value="Bob Dylan">Bob Dylan</option> <option value="Bonnie Tyler">Bonnie Tyler</option> <option value="Dolly Parton">Bonnie Tyler</option> </select> </form> </br> <div id="txt"><b>選擇下拉列表，顯示詳細(xì)信息</b></div> </body> </html>

?????? ???

????