DOM not updating

DOM not updating

本文关键字：updating not DOM      更新时间：2023-09-26

我不知道为什么，但在类似的代码开始工作之前。现在，服务器重新启动，代码将根本无法工作。我已经将下面代码中的问题隔离为DOM的问题，特别是id为"缩略图"的div。无论怎样，我都无法更改div的innerHTML，即使是在Google Chrome的控制台中（使用document.getElementById（"thumbus"）.inerHTML）。div是空的（带有"hi"的p标记被删除），变量"output"被设置为它应该是的（而不是空的）。有人知道为什么吗？

如果你想自己测试，请访问quantumquantonium.dns.net/images_and_videos/screenshots/

<h1>Screenshots</h1>
<div id = "thumbnails" align = "center"><p>hi</p></div>
<div class="gallery" align="center">
    <img name="preview" id="preview" alt=""></img>
</div>
<script type="text/javascript">
var xhttp = new XMLHttpRequest();
var output;
function update(){
    xhttp.onreadystatechange = function() {
            if (xhttp.readyState == 4 && xhttp.status == 200) {
                console.log("readystate = 4");
                output = xhttp.responseText;
                console.log(output);
                document.getElementById("thumbnails").innerHTML = output;
            }
    }
}
function sendInfo(){
    xhttp.open("GET","http://quantumquantonium.ddns.net/images_and_videos/screenshots/php.php" ,true);
    xhttp.send();
    update();
}
sendInfo();
</script>

问题不在您使用的代码中，而在从服务器返回的数据中，它有无效的HTML（double(")和single quotes(')不平衡，您应该使用双引号来分隔HTML中的属性值）标记的某些部分在这里：

<img onmouseover= " preview.src='2015-01-25_00004.jpg" name=2015-01-25_00004.jpg src=2015-01-25_00004.jpg alt='' style = 'width:50px;height:50px;>
<img onmouseover= " preview.src='2015-01-25_00006.jpg" name=2015-01-25_00006.jpg src=2015-01-25_00006.jpg alt='' style = 'width:50px;height:50px;>   
<img onmouseover= " preview.src='2015-01-29_00003.jpg" name=2015-01-29_00003.jpg src=2015-01-29_00003.jpg alt='' style = 'width:50px;height:50px;>
<img onmouseover= " preview.src='2015-01-29_00004.jpg" name=2015-01-29_00004.jpg src=2015-01-29_00004.jpg alt='' style = 'width:50px;height:50px;>

更正你的html，它是；；）

你可以试试这个html格式：

<img onmouseover="preview.src='2015-01-29_00004.jpg'" name="2015-01-29_00004.jpg" src="2015-01-29_00004.jpg" alt="" style="width:50px; height:50px;">

那堆

<img onmouseover= " preview.src='2015-01-25_00004.jpg" name=2015-01-25_00004.jpg src=2015-01-25_00004.jpg alt='' style = 'width:50px;height:50px;>

您从API获得的标签格式严重错误。难怪HTML解析器会将它们全部丢弃，留下一个空的DOM。

相关文章：