javascript - 隐藏损坏的 img chrome 扩展

Question

我的问题：在 jsfiddle 上，我成功地隐藏了损坏的图像图标。但是，当加载到 Chrome 扩展程序上时，它不起作用：/

例子：

一些背景： “post.url”可能是也可能不是图像文件。如果不是，我想隐藏它。我怎么做？

这是我当前的代码：

$("#art").append('<img id="img" src="' + post.url + '"onerror="this.style.display=\'none\'"/>');

标签： javascriptjqueryhtmlcssgoogle-chrome-extension

Answer 1

1. 使用正确的 devtools - 扩展弹出窗口有自己单独的一个可通过右键单击弹出窗口访问，然后单击“检查”（请参阅​​各种浏览器的此答案）；
2. 在正确的开发工具中，您会看到有关内联 JS 被阻止的错误；
3. 由于默认情况下扩展不能使用内联 JS（这是一件好事，所以不要更改它），
   而是以编程方式附加 onerror 侦听器：

$(`<img id="img" src="${post.url}">`).appendTo('#art').on('error', function() {
  this.style.display = 'none';
});