为什么我的代码给了我一个TypeError:x.documentElement是未定义的?

时间:2015-06-19 11:11:20

标签: javascript php html ajax xml

我正试图从这个php获取一个xml:

 <?php
    // ...

    $row = mysqli_fetch_array($result);

    $xml = new DOMDocument("1.0", "UTF-8");

    $book = $xml->createElement("book");
    $book = $xml->appendChild($book);

    $bookId = $xml->createElement("id",$row['id']);
    $bookId = $book->appendChild($id);

    $bookAuthor = $xml->createElement("author",$row['author']);
    $bookAuthor = $book->appendChild($bookAuthor);

    $bookTitle = $xml->createElement("title", $row['title']);
    $bookTitle = $book->appendChild($bookTitle);

    $bookGenre = $xml->createElement("genre",$row['genre']);
    $bookGenre = $book->appendChild($bookGenre);

    $bookDescription = $xml->createElement("description",$row['description']);
    $bookDescription = $book->appendChild($bookDescription);

    echo($xml->asXML());

    mysql_close($con);
    ?>

到这个js函数(使用AJAX):

function ByTitle(title) {

    document.getElementById("results").innerHTML = "";
    var xmlDoc;
    var Output = "";

    if (title != "") {

        if (window.XMLHttpRequest) {

            xmlhttp = new XMLHttpRequest();
        }

        xmlhttp.open("GET", "getBooksByTitle.php?title=" + title, true);
        xmlhttp.send(null);

        xmlhttp.onreadystatechange = function () {

            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {

                xmlDoc = xmlhttp.responseXML;
                var x = xmlDoc.getElementsByTagName('book');
                alert(x.textContent);

                Output = "<table><br><p><b>Results:</b></p><table><tr><th>id</th><th>author</th><th>title</th><th>genre</th><th>price</th><th>description</th></tr><tr>";

                Output += "<td>" + x.documentElement.getElementsByTagName('id')[0].childNodes[0].nodeValue + "</td>";
                Output += "<td>" + x.documentElement.getElementsByTagName('author')[0].childNodes[0].nodeValue + "</td>";
                Output += "<td>" + x.documentElement.getElementsByTagName('title')[0].childNodes[0].nodeValue + "</td>";
                Output += "<td>" + x.documentElement.getElementsByTagName('genre')[0].childNodes[0].nodeValue + "</td>";
                Output += "<td>" + x.documentElement.getElementsByTagName('price')[0].childNodes[0].nodeValue + "</td>";
                Output += "<td>" + x.documentElement.getElementsByTagName('description')[0].childNodes[0].nodeValue + "</td></tr></table>";

                document.getElementById("results").innerHTML = Output;
            }
}

但不幸的是,我得到的唯一的是TypeError:

  

x.documentElement未定义(:Mozilla)。

我尝试了很多不同的“解决方案”,但没有一个有任何区别......

1 个答案:

答案 0 :(得分:0)

您不需要像x.documentElement那样拨打xmlDoc  所以你应该使用这样的东西:

Output += "<td>" + xmlDoc.getElementsByTagName('id')[0].childNodes[0].nodeValue + "</td>";
Output += "<td>" + xmlDoc.getElementsByTagName('author')[0].childNodes[0].nodeValue + "</td>";
Output += "<td>" + xmlDoc.getElementsByTagName('title')[0].childNodes[0].nodeValue + "</td>";
Output += "<td>" + xmlDoc.getElementsByTagName('genre')[0].childNodes[0].nodeValue + "</td>";
Output += "<td>" + xmlDoc.getElementsByTagName('price')[0].childNodes[0].nodeValue + "</td>";
Output += "<td>" + xmlDoc.getElementsByTagName('description')[0].childNodes[0].nodeValue + "</td></tr></table>";

另外:使用JSON作为ajax请求的服务器响应更容易,因为您只需要使用JSON.parse(data)将您的响应用作普通JS对象。