Question

我正在编写我的第一个firefox附加组件。它已经完成了，但是mozilla用这个答案拒绝了它：

1）您的加载项通过分配innerHTML或通过类似方式从包含可能未经过数据删除的数据的HTML字符串创建DOM节点。除了效率低下，这是一个主要的安全风险。有关更多信息，请参阅https://developer.mozilla.org/en/XUL_School/DOM_Building_and_HTML_Insertion。以下是您执行此操作的一些示例:(剪切...）

我写道：

var myDiv = content.document.getElementById("myContent");
myDiv.innerHTML = "some html code";

现在我不是JS程序员，我不明白该怎么做。我测试了一些像这样的代码：

var NewNode = content.document.createElement("span");
NewNode.appendChild(content.document.createTextNode("Hello World!"));                   

//content.document.body.appendChild(NewNode);//ok, works
content.document.getElementById("myContent").appendChild(NewNode);//doesn't work

但是在我将它追加到.body

之前它不起作用

在其他网页上工作的示例似乎无法在此处运行。此外，我不明白它是否解决了mozilla指出的问题。

你能帮我解决一下应该取代我写的两行的代码吗？如果您需要完整代码，请输入：http://www.maipiusenza.com/LDV/down/ldvgenerator.xpi

谢谢！纳迪亚

Answer 1

刚刚做了一个快速的小提琴，我想知道为什么你使用了content.document所以我把它修改为文档并且它有效。

http://jsfiddle.net/eDW82/

var NewNode = document.createElement("span");
NewNode.appendChild(document.createTextNode("Hello World"));
document.getElementById("myContent").appendChild(NewNode);

我在使用未经过处理的HTML时遇到了类似的问题，因为我广泛使用它，我选择使用jQuery来传递mozillas规则。它使得以这种方式创建节点变得更加容易。

$("<div>", {id:"example"}).text("Hello World")

它只是阅读得那么好。

Answer 2

好的，我做了一些挖掘，我想我找到了你的问题：

每当您想要向您的扩展程序注入任何类型的HTML时，浏览器会将其视为安全漏洞，这就是您遇到此问题的原因。你有2种不同的解决方案;

首先：你可以创建一个iframe并用它来显示你的html（在javascript中我们想要显示一个文件时我们有2个选项，首先在服务器上传递文件路径，或者使用data:直接显示您的数据：

var htmlStr = "<span>Hello World!</span>";
var frm = content.document.createElement("iframe");
content.document.getElementById("myContent").appendChild(frm); 
frm.src = "data:text/html;charset=utf-8," + encodeURIComponent(htmlStr);

第二：如果您不想使用iframe显示您的HTML，此解决方案可以帮助您。

var htmlStr = "<span>Hello World!</span>";
var frm = document.createElement("iframe");
frm.style.display="none";
document.body.appendChild(frm);

var win = frm.contentWindow;
var frmrange = win.document.createRange();
// make the parent of the first div in the document becomes the context node
frmrange.selectNode(win.document.firstChild);
var frg = frmrange.createContextualFragment(htmlStr);
content.document.getElementById("myContent").appendChild(frg);

旧猜测：代码中的问题是不同的document个对象，试试这个：

var NewNode = content.document.createElement("span");
NewNode.appendChild(content.document.createTextNode("Hello World!"));

content.document.getElementById("myContent").appendChild(NewNode);

这是我第一个指出的线索。

不允许使用firefox附加的innerHTML，需要DOM帮助

2 个答案: