Javascript 如何不插入重复的图像？
所以我所做的是，我创建了一个函数，使用XMLHttpRequest从数据库中检索数据（图像），并每5000毫秒将其附加到Javascript 如何不插入重复的图像？,javascript,html,css,Javascript,Html,Css,所以我所做的是，我创建了一个函数，使用XMLHttpRequest从数据库中检索数据（图像），并每5000毫秒将其附加到td。现在，由于它们每5000毫秒追加一次，如果检索到的数据没有更改，那么它会一次又一次地追加相同的数据。为了阻止它，我将自定义属性附加到带有ID的图像上，但我不确定如何阻止它附加重复的项目。这是我的JS： function getAlbumImages() { var xhr2 = window.XMLHttpRequest ? new XMLHttpRequest(
tdfunction getAlbumImages() {
var xhr2 = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");
xhr2.open('GET', 'admin/images_data.php');
xhr2.onreadystatechange = function(e) {
if(xhr2.readyState == 4 && xhr2.status == 200) {
var album_photos = JSON.parse(xhr2.responseText);
for(var i = 0; i < album_photos.length; i++) {
var td = document.createElement('td');
var imagewrap = document.createElement('div');
imagewrap.className = "image-wrap";
var imagemenu = document.createElement('div');
imagemenu.className = "image-menu";
var imagemenuimg1 = document.createElement('img');
imagemenuimg1.src = "img/edit_img.png";
var imagemenuimg2 = document.createElement('img');
imagemenuimg2.src = "img/close.png";
var imagewrapimg = document.createElement('img');
imagewrapimg.className = "thumbnail";
imagewrapimg.src = "admin/album_photos/" + album_photos[i].Image_Path;
imagewrapimg.setAttribute("data-image-id", album_photos[i].Image_ID);
document.getElementById("tiare").appendChild(td);
td.appendChild(imagewrap);
imagewrap.appendChild(imagemenu);
imagemenu.appendChild(imagemenuimg1);
imagemenu.appendChild(imagemenuimg2);
imagewrap.appendChild(imagewrapimg);
}
}
}
xhr2.send(null);
}
setInterval(function(){
getAlbumImages();
}, 5000);
<html>
<head>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<!-- <div class="big_image" id="drop_zone">
<img src="" id="big_img" />
</div -->
<div class="images_holder">
<div class="header">
Album Name - Photo Album
<span class="close"><img src="img/close.png" /></span>
</div>
<div class="body">
<table width="80%">
<tr id="tiare">
</tr>
</table>
</div>
</div>
<div id="drop_zone">
Drag/Drop images to upload.
</div>
<div style="height: 30px; width: 80%; color: white; text-align: center; margin: 0 auto;">
<p id="progress_bar" style="width: 0%; background-color: red;"></p>
</div>
<script src="js/script.js"></script>
</body>
</html>
相册名称-相册
拖放要上载的图像。
注意：不允许JQUERY:） 在插入之前，只需检查具有相同ID或URL的实例是否位于页面上
if(document.querySector('div.thumbnail[data-image-id="' + album_photos[i].Image_ID + '"]')){
continue;
}