在页面加载后使用JavaScript删除404 src错误的方法有以下几种:
示例代码:
<img src="invalid-image.jpg" onerror="this.remove()">
在上述示例中,当图片加载失败时,会触发onerror事件,然后通过this.remove()将该图片元素从DOM中删除。
示例代码:
var img = new Image();
img.src = "invalid-image.jpg";
img.onerror = function() {
this.remove();
};
在上述示例中,我们使用JavaScript创建了一个图片元素,并为其设置了src属性。当图片加载失败时,会触发onerror事件,然后通过this.remove()将该图片元素从DOM中删除。
示例代码:
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
if (mutation.type === 'childList') {
mutation.addedNodes.forEach(function(node) {
if (node.tagName === 'IMG' && node.src === 'invalid-image.jpg') {
node.remove();
}
});
}
});
});
observer.observe(document.body, { childList: true, subtree: true });
在上述示例中,我们创建了一个MutationObserver对象,并通过observe方法来监听document.body及其子节点的变化。当有新的节点添加到DOM中时,会触发MutationObserver的回调函数。我们可以在回调函数中判断节点是否为图片元素,并且src属性为加载失败的资源,然后执行相应的操作,比如删除该图片元素。
需要注意的是,以上方法仅适用于在页面加载后动态添加的资源。对于静态资源,可以通过服务器端配置或其他方式来处理404错误。
领取专属 10元无门槛券
手把手带您无忧上云