0

我对 HTML 很陌生。我正在尝试加载包含图像名称的 XML 并将其动态显示在 div 中。我可以看到图像名称,但无法分配 img 来源。

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
if (window.XMLHttpRequest) {xmlhttp=new XMLHttpRequest();}
else{xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");}

xmlhttp.open("GET","resimler.xml",false);
xmlhttp.send();
xmlDoc=xmlhttp.responseXML; 
x=xmlDoc.getElementsByTagName("pic");
i=0;

function displayFoto(){
ad=(x[i].getElementsByTagName("ad")[0].childNodes[0].nodeValue);
document.getElementById("showFoto").innerHTML="img/" + ad;}

function next(){
if (i<x.length-1){
  i++;
  displayFoto();}}

function previous(){
if (i>0){
  i--;
  displayFoto();}}
</script>
</head>
<body onload="displayFoto()">
<div id='showFoto'><img id='showFoto'></img></div><br>
    <input type="button" onclick="previous()" value="<<" />
    <input type="button" onclick="next()" value=">>" />
</body>
</html>

谁能指导我?

4

3 回答 3

1
document.getElementById("showFoto").src="img/" + ad;

这将帮助您加载图像,但我不保证其余代码。您最好寻找 Loader 框架和 jquery。

于 2012-10-04T14:36:20.373 回答
0

我同意 Kemal 的观点,只需给出你的 xml 片段,而且 div 和 img 标签的 id 是相同的,是你不知道还是故意的

于 2012-10-04T14:32:21.867 回答
0

    <script type="text/javascript">

        function loadXMLDoc()
        {
            if (window.XMLHttpRequest)
            {
                xmlhttp = new XMLHttpRequest();
            }
            else
            {
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            xmlhttp.onreadystatechange = function ()
            {
                if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
                {
                    xmlDoc = xmlhttp.responseXML;
                    var Image = "";
                    x = xmlDoc.getElementsByTagName("IMAGE");

                    for (i = 0; i < x.length; i++)
                    {
                        Image = Image + x[i].childNodes[0].nodeValue + " ";
                        var res = Image.split(" ");

                        var ii = res[i];
                        var img = document.createElement("img");
                        img.src = ii;
                        img.width = 150;
                        img.height = 100;

                        document.body.appendChild(img);
                    }

                }
            }
            xmlhttp.open("GET", "ll.xml", true);
            xmlhttp.send();
        }
    </script>

</head>
<body onload="loadXMLDoc()">

</body>

于 2015-03-13T11:56:43.103 回答