Question

我是编写Firefox扩展程序的新手，并希望在Firefox扩展程序的JavaScript中将div附加到文档而不是网页正文。我怎么能这样做？

   var div = document.createElement("div");
   div.id = "div1";
   div.textContent = "Its my div";
   var st = div.style;
   st.display = "block";
   st.top = "0px";
   st.left = "0px";
   st.width = "100%";
   document.appendChild(div);

Answer 1

document.documentElement为您提供HTML标记的DOM元素。

document.documentElement.appendChild(div);

Answer 2

使用XUL-overlays（和XUL窗口）时，请注意window和document不是指Web内容，而是XUL窗口本身（浏览器本身）。

document.documentElement.localName == "window"; // not "html"
document.documentElement.namespaceURI == "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"

您需要使用content or gBrowser与浏览器窗口中的标签中加载的网站进行互动（Firefox中为browser.xul）

例如，要让您的代码创建并向所选标签中的网站的<div>添加<html>（这不是有意义的，但似乎问题是要求）

var div = content.document.createElement("div"); // note the use of `content`
div.id = "div1";
div.textContent = "Its my div";
var st = div.style;
st.display = "block";
st.top = "0px";
st.left = "0px";
st.width = "100%";
content.document.documentElement.appendChild(div); // note the use of `content`

当然，该示例仅适用于：

在浏览器窗口本身已满载
当前活动的标签实际上是一个html文档，并且已加载足以具有可用的DOM。

参见例如"Detecting page load"部分以及该页面上的其他文档和示例以及相关/链接的页面。

在某个相关问题上，请注意Firefox代码和所有XUL叠加层共享一个共同的范围/命名空间，因此您需要确保代码使用的全局变量不会发生冲突或可能发生冲突与其他代码。通常，您可以通过prefixing/namespacing your stuff或仅使用匿名函数来获取非共享函数范围。

var div = ...; // bad, might conflict with other code
(function() {
  "use strict";
  // strict mode, to make implicit variable declarations an error, among other thiings

  var div = "..."; // OK, local to the anonymous function
  ...
})();

如何在Firefox扩展中的javascript中将div附加到文档，而不是正文

2 个答案: