页面中图片加载错误后替换默认图片
2021-08-31 本文已影响0人
放逐的帝王
有时候前端图片加载出错,页面空白一块影响体验
replaceErrorImg(){
document.removeEventListener("error",imgErrorReplace);
document.addEventListener("error",imgErrorReplace, true);
function imgErrorReplace (e) {
console.log(e,"发现图片加载失败")
var normalUrl = store.state.mindFlowType == "mind" ? require("../assets/img/view_mind.svg") : require("../assets/img/view_flow.svg");
var elem = e.target;
if (elem.tagName.toLowerCase() == "img" && elem.src != normalUrl && elem.parentNode.className.indexOf("view")>-1 ) {
elem.src = normalUrl;
}
}
}
if (elem.tagName.toLowerCase() == "img" && elem.src != normalUrl && elem.parentNode.className.indexOf("view")>-1 )
这里的 第一个条件 判断 当前元素是 img标签 :必须
第二个条件 图片地址不是替换的地址:必须
第三个条件 页面中需要加载出错的替换的地方,用className 标识:可变