3

我正在尝试使用Firefox 插件 SDK(据我了解,以前称为 Jetpack),但我在使用 DOM 时遇到了问题。

当网页加载时,我需要遍历 DOM 中的所有文本节点并对它们包含的一些字符串进行更改。我在下面发布了我正在做的事情的简化版本(Javascript 的新手,所以请原谅我的任何奇怪之处)。

    // test.js

    function parseElement(Element)
    {
      if (Element == null)
        return;

      var i = 0;
      var Result = false;

      if (Element.hasChildNodes)
      {
        var children = Element.childNodes;
        while (i <= children.length - 1)
        {
          var child = children.item(i);
          parseElement(child);
          i++;
        }
      }

      if (Element.nodeType == 3)
      {
        // For testing - see what the text node contains
        alert(Element.nodeValue);
        Result = true;
      }

      return Result;
    }

    window.addEventListener("load", function load(event)
    {
      window.removeEventListener("load", load, false);
      parseElement(document.body); 
    }

当我创建一个基本的 HTML 文档时:

    <!-- test.html -->

    <html>
      <head>
        <script type="text/javascript" src="test.js"></script>
      </head>
      <body>
        <b>hello world</b>
        <p>foo</p>
        <i>test</i>
      </body>
    </html>

...在 HEAD 部分中包含此 Javascript 文件,然后在 Firefox 中打开它,“警报”会显示 6 个对话框,其中包含:

    1) "hello world"
    2) blank -> no visible characters, just a newline
    3) "foo"
    4) blank -> no visible characters, just a newline
    5) "test"
    6) blank -> no visible characters, just a newline

正是我期望看到的。

当我创建一个插件并使用 test.js 作为我的 main.js 文件中的 page-mod 内容脚本时出现问题(修改为删除“addEventListener”部分)。当我使用“cfx run”启动安装了我的插件的 Firefox,然后打开相同的 HTML 文档(test.js 文件的“脚本”部分已注释),警报根本不显示

所以这是第一个谜题。但也导航到其他网页 - 例如,YouTube 视频页面 -警报确实显示了几个对话框,但它们包含非常奇怪的字符串,主要是脚本标签的内容:

编辑我没有足够的声誉来嵌入图像,所以这里有一个链接,而不是显示我的意思:http: //img46.imageshack.us/img46/5994/mtpd.jpg

再一次,我希望看到的文本不存在。

为下面的一些冗余道歉,但要明确一点:这是我的 main.js:

    main.js

    var data = require("sdk/self").data;
    var data = require("sdk/self").data;

    exports.main = function()
    {
      pageMod.PageMod({
        include: "*",
        contentScriptFile: [data.url("test.js")]
      });
    }

Javascript 文件的修改版本与上面的“test.js”列表相同,但对于结尾部分:

    test.js

    <snip>
      ...
      return Result;
    }

    parseElement(document.body);

如果它使事情更容易可视化,我已经将我的项目文件(如果我可以这样称呼它们)包含在一个 zip 中:http ://www.mediafire.com/?774iprbngtlgkcp

我试过改变

    parseElement(document.body);

    parseElement(unsafeWindow.document.body);

万一它有什么不同,但结果是相同的。

所以我对正在发生的事情感到非常困惑。我不明白为什么当我将 test.js 文件用作插件的一部分时,它没有从 DOM 中挑选出文本节点(并且只有文本节点),但它完全符合我在作为插件包含时的预期HTML 文档中的脚本。任何人都可以对此有所了解吗?

先感谢您。

4

2 回答 2

2

您的 lib 代码和 contentScripts 中的错误通常会记录到错误控制台。检查那里打印的内容。另请参阅 SDK 控制台模块。

您的 page-mod 不会运行,因为默认情况下 page-mods 只会在 load 事件之后运行。请参阅contentScriptWhen文档。

script 标签实际上通常有一个包含内联脚本源的文本节点子节点。因此,这些也被枚举是绝对正常的。

有关行走树节点的一些讨论,请参阅:getElementsByTagName() 等效于 textNodes 但是,如果您在特定 id/类的文本之后,请考虑使用document.querySelector/.querySelectorAll,或者如果您在具有特定 XPath 的节点之后,请使用document.evaluate。这很可能会快很多。

除此之外,我无法真正说出您的剩余问题到底是什么以及您首先要达到的目标,所以我无法就此提出建议。

于 2013-08-05T22:54:20.507 回答
1

你想知道

我发现当通过 File->Open File 访问文档时,我的插件没有被执行。

这是设计使然。在match-pattern,它说

单个星号匹配任何带有 http、https 或 ftp 方案的 URL。对于文件、资源或数据等其他方案,请使用后跟星号的方案,如下所示。

您可以使用正则表达式/.*/来匹配所有站点和所有架构。

于 2015-09-07T16:47:13.443 回答