尝试更改 HTML 属性时出现奇怪的获取请求

Question

所以我有一个 html 文件，单击按钮后，它会在单独的文件中调用此函数：

function getRandomVideoLink(){
    //AJAX request to /random-video
    console.log("ajax request");
    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function() {
        if (xhttp.readyState == 4 && xhttp.status == 200) {
            console.log("inside if");
            console.log(xhttp.responseText);
            document.getElementById("myVideo").src = xhttp.responseText;
        }
    };
    xhttp.open("GET", "/random-videolink", true);
    xhttp.send();
}

问题是由于某种原因，它没有更改元素的 src 属性，而是向服务器发出了一个奇怪的 get 请求，我收到一个错误 404（正常，因为在 app.use() 中处理的请求不是支持我指定显示该错误）。它应该只更改 iframe 的属性并显示另一个视频。

另一方面，如果我通过

调用它

function change() {
    document.getElementById('myVideo').src = "https://www.youtube.com/embed/BfOdWSiyWoc";
}

它工作正常。注意：xhttps.responseText 与该链接相同。

相关的 HTML：

<iframe id="myVideo" width="420" height="345"
   src="http://www.youtube.com/embed/XGSy3_Czz8k">
</iframe>

Answer 1

我认为问题在于您在xhttp.responseText 中获得了引用的网址