Question

我正在尝试制作一个简单的Chrome扩展程序，从页面中删除YouTube的Feed，并将其替换为图像。我可以删除Feed，但放置图像已证明很麻烦。我只想用图像替换Feed。代码如下，任何指针或文档都会非常感激！

var feed = document.getElementById('feed');
var feedsParent = feed.parent();
feed.parentNode.removeChild(feed);
feedsParent.firstChild.prepend('<img id="theImg" src="http://www.sgt.gr/_repository/file/1/Resize/images/sun-ra-2_site.jpg" />')

Answer 1

请改用.insertAdjacentHTML。

var feed = document.getElementById('feed');
var feedsParent = feed.parentNode;
feedsParent.removeChild(feed);
feedsParent.firstChild.insertAdjacentHTML("beforebegin", '<img id="theImg" src="http://www.sgt.gr/_repository/file/1/Resize/images/sun-ra-2_site.jpg" />')

这将允许您将从HTML解析的新节点注入相对于给定元素的各种位置。

我假设.firstChild实际上指向一个Element节点。如果没有，您可以使用.firstElementChild。

Answer 2

为什么要混合使用jquery和vanilla javascript？请尝试仅使用jquery ..

var feed = $('#feed');
var feedsParent = feed.parent();
feed.remove();
feedsParent.prepend('<img id="theImg" src="http://www.sgt.gr/_repository/file/1/Resize/images/sun-ra-2_site.jpg"/>');

希望这有帮助！

将图像添加到第一个孩子

2 个答案: