Question

我正在开发一个基于xml内容显示图像的内容流。我正在建立它作为一个网站，所以它是HTML和JavaScript，并且由于一些未知的原因 - 并且相信我，我已经用尽可能好的牙齿梳梳理它 - 我的javascript只是没有加载我的xml （那就是我很确定问题是什么，但我可能错了）而且它给我带来了'getElementsByTagName'为空的错误。现在我还没有内置完整的功能，我只想通过把它作为文本读出来测试xml，所以请耐心等待。

loadXMLDoc.js：

function loadXMLDoc(filename)
{
if (window.XMLHttpRequest)
{
xhttp=new XMLHttpRequest();
}
else // code for IE5 and IE6
{
xhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xhttp.open("GET",filename,false);
xhttp.send();
return xhttp.responseXML;
}

我在html中的内部java：

<script>
xmlDoc = loadXMLDoc("test.xml");
    var x = xmlDoc.getElementsByTagName("song");
    for (i=0; i<x.length; i++);
    {
     var a = (x[i].getElementsByTagName("source")[0].childnodes[0].nodeValue);
     var b = (x[i].getElementsByTagName("artist")[0].childnodes[0].nodeValue);
     var c = (x[i].getelementsByTagName("title")[0].childnodes[0].nodeValue);
     var par = '<img class= "item" href ="#" ondblclick = "confirm()" src ="' +'" "title="' +b+ '"-"'+ c+ ' " />';
     document.getElementById("demo").innerHTML += par;
     }
</script>

和完整的错误：

未捕获的TypeError：无法读取undefined album.html的属性'getElementsByTagName'：24 （匿名函数）

用于测试我的xml样本：

<song>
<source>imgs/Beck.jpg</source>
<title>Modern Guilt</title>
<artist>Beck</artist>
</song>

希望我能够涵盖所有需要的东西，我知道它可能是愚蠢的，但我无法确定它。

Answer 1

首先你有一个“;”在你的for循环后不应该在这里：

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

应该是

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

因为这里发生的事情是你循环迭代x的元素而不执行你的身体。

其次，你的

var c = (x[i].getelementsByTagName("title")[0].childnodes[0].nodeValue);

包含一个拼写错误，它应该是带有e大写的getElementsByTagName

以下是我使用的代码，它运行正常：

<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>
<body>

<div id="demo"></div>

<script>
var loadXMLDoc = function (filename) {
        var xhttp;
        if (window.XMLHttpRequest) {
            xhttp = new XMLHttpRequest();
        } else {
            xhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        xhttp.open("GET",filename,false);
        xhttp.send();

        if (xhttp.readyState === 4 && xhttp.status === 200) {
            return xhttp.responseXML;
        }
        return {error : 'file not found'};

    },
    xmlDoc = loadXMLDoc("test.xml"),
    testObj = xmlDoc,
    x = testObj.getElementsByTagName("song");
for (i=0; i<x.length; i++) {
    var objectElem = x[i];
     var a = (objectElem.getElementsByTagName("source")[0].textContent),
         b = (objectElem.getElementsByTagName("artist")[0].textContent),
         c = (objectElem.getElementsByTagName("title")[0].textContent),
         par = '<img class="item" href="#" ondblclick="confirm()" src="'+ a +'" title="' +b+ '-'+ c+ '" />';
     console.log(par);
     document.getElementById("demo").innerHTML += par;
 }
</script>

</body>

</html>

这是我的test.xml（放在与上面代码相同的文件夹中）：

<songlist>
    <song>
        <source>imgs/Beck.jpg</source>
        <title>Modern Guilt</title>
        <artist>Beck</artist>
    </song>
    <song>
        <source>imgs/Beck2.jpg</source>
        <title>Modern Guilt2</title>
        <artist>Beck2</artist>
    </song>
</songlist>

Answer 2

以防它实际上是异步请求的问题，这就是你异步执行的方式（我冒昧地在本地声明xhttp）：

function loadXMLDoc(filename, callback)
{
    var xhttp;
    if (window.XMLHttpRequest)
    {
        xhttp=new XMLHttpRequest();
    }
    else // code for IE5 and IE6
    {
        xhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xhttp.open("GET",filename,true);
    xhttp.onreadystatechange = function()
    {
        if(xhttp.readyState === 4)
        {
            callback(xhttp.responseXML);
        }
    }
    xhttp.send();
}

loadXMLDoc("test.xml", function(xmlDoc)
{
    var x = xmlDoc.getElementsByTagName("song");
    for (i=0; i<x.length; i++)
    {
        var a = (x[i].getElementsByTagName("source")[0].childnodes[0].nodeValue);
        var b = (x[i].getElementsByTagName("artist")[0].childnodes[0].nodeValue);
        var c = (x[i].getElementsByTagName("title")[0].childnodes[0].nodeValue);
        var par = '<img class= "item" href ="#" ondblclick = "confirm()" src ="' +'" "title="' +b+ '"-"'+ c+ ' " />';
        document.getElementById("demo").innerHTML += par;
    }
});

但请确保Web请求的结果具有text/xml的Content-Type标头，否则将不会设置resultXML。无论如何，您可能需要查看文档：{{3}}

编辑：还修复了Adrien Vinches提到的错别字。

＆＃39;的getElementsByTagName＆＃39;未定义

2 个答案: