Javascript：图像错误处理&；筑巢

我想要一个错误处理脚本。如果找不到图像，请删除（或不可见）加载失败的标记。我将感谢任何帮助

HTML DOM:

<div class="swiper-slide" data-index="2" style="width: 145px; margin-right: 10px;">
    <div class="swiper-slide-inside ">
        <div class="align-vertical">
            <img src="images/product_images/gallery_images/0690-05-bx_3.jpg" alt="Mobile" data-magnifier-src="images/product_images/popup_images/0690-05-bx_3.jpg">
        </div>
    </div>
</div>

---

有几个问题

• img

  标记没有您在选择器中使用的类
• 您试图隐藏的是第一张

  swiper幻灯片

  ，而不是第一张

  swiper幻灯片

演示

document.queryselectoral（“.swiper-slide-img”）[0]。addEventListener（“错误”，myFunction）；
函数myFunction（事件）{
console.log（'未找到映像'）；
//如果只有一个这样的元素，请使用document.querySelector（'.swiper slide'）.style.display=“none”，并在第行下方放弃
event.target.parentNode.parentNode.parentNode.style.display=“无”；
}

您的

img

标签没有

img responsive

类。可视性应称为可视性非常感谢gurvinder372！

document.querySelectorAll(".swiper-slide .img-responsive")[0].addEventListener("error", myFunction);

function myFunction() {
    console.log('Image not found.');
    document.querySelectorAll('.swiper-slide')[0].style.visbility = "hidden";
}