AJAX XML

AJAX를 사용하여 XML 파일과 대화식으로 통신할 수 있습니다.

AJAX XML 예

다음 예는 웹 페이지가 AJAX를 통해 XML 파일에서 정보를 읽는 방법을 보여줍니다.

예

CD를 선택하세요. > -위의 목록에서 "showCD()"라는 함수가 실행됩니다. 이 함수는 "onchange" 이벤트에 의해 트리거됩니다.

   <html>
        <head>
        <script>
        function showCD(str)
        {
            if (str=="")
            {
                document.getElementById("txtHint").innerHTML="";
                return;
            }
            if (window.XMLHttpRequest)
            {
                // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行
                xmlhttp=new XMLHttpRequest();
            }
            else
            {
                // IE6, IE5 浏览器执行
                xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
            }
            xmlhttp.onreadystatechange=function()
            {
                if (xmlhttp.readyState==4 && xmlhttp.status==200)
                {
                    document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
                }
            }
            xmlhttp.open("GET","getcd.php?q="+str,true);
            xmlhttp.send();
        }
        </script>
        </head>
        <body>
        <form>
        Select a CD:
        <select name="cds" onchange="showCD(this.value)">
        <option value="">Select a CD:</option>
        <option value="Bob Dylan">Bob Dylan</option>
        <option value="Bonnie Tyler">Bonnie Tyler</option>
        <option value="Dolly Parton">Dolly Parton</option>
        </select>
        </form>
        <div id="txtHint"><b>CD info will be listed here...</b></div>
        </body>
     </html>

showCD() 함수는 다음 단계를 수행합니다.

1) CD가 선택되었는지 확인

2) XMLHttpRequest 객체 생성

3) 서버 응답이 준비되면 실행되는 함수 생성

4) 서버의 파일에 요청 보내기

5) 참고 사항 URL 끝에 추가된 매개변수(q ) (드롭다운 목록의 내용 포함)

참고:

위 예시에는 JavaScript 지식이 많이 사용되었습니다. 이 장을 먼저 읽어보세요: JavaScript Tutorial

PHP 파일

위에서 JavaScript를 통해 호출되는 서버 페이지는 "getcd.php"라는 이름의 PHP 파일입니다. .

PHP 스크립트는 XML 문서 "cd_catalog.xml"을 로드하고 XML 파일에 대해 쿼리를 실행한 후 결과를 HTML로 반환합니다.

<?php
$q=$_GET["q"];
$xmlDoc = new DOMDocument();
$xmlDoc->load("cd_catalog.xml");
$x=$xmlDoc->getElementsByTagName('ARTIST');
for ($i=0; $i<=$x->length-1; $i++)
{
// 处理元素节点
if ($x->item($i)->nodeType==1)
{
if ($x->item($i)->childNodes->item(0)->nodeValue == $q)
{
$y=($x->item($i)->parentNode);
}
}
}
$cd=($y->childNodes);
for ($i=0;$i<$cd->length;$i++)
{ 
// 处理元素节点
if ($cd->item($i)->nodeType==1)
{
echo("<b>" . $cd->item($i)->nodeName . ":</b> ");
echo($cd->item($i)->childNodes->item(0)->nodeValue);
echo("<br>");
}
}
?>

CD 쿼리가 다음과 같은 경우 JavaScript에서 PHP 페이지로 전송되는 경우:

1. PHP는 XML DOM 객체를 생성합니다.

2. JavaScript로 전달된 데이터

3. 앨범 정보를 출력하고 "txtHint" 자리 표시자를 다시 보냅니다.

요약: xml 형식 반환

장점:

XML은 범용 데이터 형식입니다.

데이터를 정의된 형식으로 강제하는 대신 데이터에 적합한 태그를 맞춤설정하세요. 문서를 완전히 제어하려면 DOM을 사용하세요.

단점:

문서가 서버에서 제공되는 경우 문서에 올바른 헤더 정보가 포함되어 있는지 확인해야 합니다. 문서 유형이 잘못된 경우 responseXML 값은 비어 있습니다.

브라우저가 긴 XML 파일을 수신하면 DOM 구문 분석이 복잡해질 수 있습니다.

지속적인 학습

||

새로운 파일

<?php //需要与前面的HTML文件联合使用 $q=$_GET["q"]; $xmlDoc = new DOMDocument(); $xmlDoc->load("cd_catalog.xml"); $x=$xmlDoc->getElementsByTagName('ARTIST'); for ($i=0; $i<=$x->length-1; $i++) { // 处理元素节点 if ($x->item($i)->nodeType==1) { if ($x->item($i)->childNodes->item(0)->nodeValue == $q) { $y=($x->item($i)->parentNode); } } } $cd=($y->childNodes); for ($i=0;$i<$cd->length;$i++) { // 处理元素节点 if ($cd->item($i)->nodeType==1) { echo("<b>" . $cd->item($i)->nodeName . ":</b> "); echo($cd->item($i)->childNodes->item(0)->nodeValue); echo("<br>"); } } ?>

제출하다 코드 재설정
자동운전