javascript - 如何使用 Chrome 扩展程序中的内容脚本将按钮/图像附加到页面？

Question

我想通过内容脚本覆盖按钮/图像，以便在特定的 URL 上可用。我原则上理解内容脚本，但我在 HTML/jQuery 和内容的组合上苦苦挣扎。

如何显示图片？

var div = document.createElement("div"); 
div.innerHtml = '<div id="qSidebarButton"><img src="imageURL.png" alt="Q Button" /></div>';
$("body").append(div);

Answer 1

您的代码不起作用，因为正确的属性是 innerHTML，而不是 innerHtml。请记住，JS 区分大小写。

var div = document.createElement("div"); 
div.innerHTML = '<div id="qSidebarButton"><img src="imageURL.png" alt="Q Button" /></div>';
$("body").append(div);

就是说，如果您包含了 jQuery，那么您可以直接使用它来附加您的 HTML。它更简单、更简洁:

$("body").append('<div><div id="qSidebarButton"><img src="imageURL.png" alt="Q Button" /></div></div>');