如何使用 <img src= > 调用 Ajax

Question

我正在尝试使用 Ajax GET 将图片插入 ID "pokedex-view"。我认为 "spriteurl" 显示的是正确的路径。但无法正常工作，并且无法找到本地文件夹的图片。这段代码有什么问题吗？谢谢

    function populatePokedex() {

    var xhr = new XMLHttpRequest();
    xhr.open("GET", "https://webster.cs.washington.edu/pokedex/pokedex.php?pokedex=all");
    xhr.onload = function(){
        if (this.status == 200) {
            var picArr = this.responseText.split("\n");

            for(var i=0; i < picArr.length; i++){
                var eachName = picArr[i].split(":")
                var spriteurl = "/Pokedex/sprites/" + eachName[1];
                document.getElementById("pokedex-view").innerHTML += spriteurl
                document.getElementById("pokedex-view").innerHTML += "<img src = spriteurl>";
            }
        } else {
            document.getElementById("pokedex-view").innerHTML = "ERROR: Status: " + this.status + ", " + this.statusText;
        }
    }
    xhr.onerror = function(){
        document.getElementById("pokedex-view").innerHTML = "ERROR";
    }
    xhr.send();
    }

Answer 1

尝试连接或插入您将 spriteurl 指定为 src 属性的方式：

document.getElementById("pokedex-view").innerHTML += '<img src="' + spriteurl + '">'

或者：

document.getElementById("pokedex-view").innerHTML += `<img src="${spriteurl}">`

如何使用 <img src= > 调用 Ajax

How to use <img src= > with Ajax call

javascript

ajax

src