javascript - Firefox Addon 添加了一个 div/iframe 但无法设置 innerHTML/src

Question

我正在编写一个 Firefox 插件，允许通过向页面添加 div/iframe 元素来注释网页。我的插件代码能够将 div 或 iframe 放置到位，但无法设置 iframe 的来源或 div 的 innerHTML。是否有一些安全限制阻止我设置 div 的 innerHTML 或 iframe 的 src？这是我的插件中的代码。

    onPageLoad: function(aEvent) {
    var doc = aEvent.originalTarget;

    var q = "";
            q = getRequestParameter(doc.location.search,"q");
            if(debug) Firebug.Console.log("query string =" + q);
            if(q!="" && q!=undefined) { 
                //To Check for target type
                //Firebug.Console.log(aEvent.originalTarget.nodeName);

            var n = document.createElement("div");      
            n.style.position = "fixed";     
            n.style.padding ="10px";
            n.style.backgroundColor ="gray";
            n.style.bottom="0";
            n.style.zIndex = "99" ;
            n.style.width ="250px";
            n.style.height="320px";
            n.style.right="10px";
            n.style.overflow="visible";

            //gBrowser.contentDocument.body.appendChild(n);
            var i = document.createElement("iframe");
            i.style.height="300px";
            i.style.width="230px";
            i.style.zindex="999";
            i.id = "rowzSearchIFrame";      
            i.src="http://annotator.com?webpagequery="+q;
            i.name ="rowzSearchIFrame";
            n.appendChild(i);

            gBrowser.contentDocument.body.appendChild(n);
            //content.document.body.appendChild(n);     
            document.frames['rowzSearchIFrame'].location.href = 'http://annotator.com?webpagequery='+q;
            alert(document.frames['rowzSearchIFrame'].id);

            document.frames['rowzSearchIFrame'].location.href = 'http://annotator.com?webpagequery='+q;

            document.getElementById('rowzSearchIFrame').setAttribute('src','http://annotator.com?webpagequery='+q);
            content.document.getElementById('rowzSearchIFrame').setAttribute('src','http://annotator.com?webpagequery='+q);


            document.getElementById('rowzSearchIFrame').src = 'http://annotator.com?webpagequery='+q;
            content.document.getElementById('rowzSearchIFrame').src = 'http://annotator.com?webpagequery='+q;
}

我的代码能够使用所有正确的 CSS 将 div 和 iframe 放置到位，但它无法设置 iframe 的 src 或 iframe 的 innerHTML。

如您所见，我已经尝试了所有可能的设置 iframe src 的机制。该脚本无法做到这一点。请帮忙!

Answer 1

您的 onPageLoad 必须位于叠加层中的某个位置，否则您将无法使用 gBrowser。如果是这种情况，您的 document.createElement 将无法工作，因为那是 chrome 窗口。

它可能与 doc.createElement 或 gBrowser.contentDocument.createElement 一起使用。我没有尝试过，但据我所知，您正在尝试在一个文档上创建元素并将其附加到另一个文档。

为了完成此答案而添加编辑。根据此答案对代码所做的更改如下(请与发布的代码进行比较以查看差异)

onPageLoad: function(aEvent) {
var doc = aEvent.originalTarget;

var q = "";
        q = getRequestParameter(doc.location.search,"q");
        if(debug) Firebug.Console.log("query string =" + q);
        if(q!="" && q!=undefined) { 
            //To Check for target type
            //Firebug.Console.log(aEvent.originalTarget.nodeName);

        var n = doc.createElement("div");      
        n.style.position = "fixed";     
        n.style.padding ="10px";
        n.style.backgroundColor ="gray";
        n.style.bottom="0";
        n.style.zIndex = "99" ;
        n.style.width ="250px";
        n.style.height="320px";
        n.style.right="10px";
        n.style.overflow="visible";

        doc.body.appendChild(n);

        var i = document.createElement("iframe");
        i.style.height="300px";
        i.style.width="230px";
        i.style.zindex="999";
        i.id = "rowzSearchIFrame";      
        i.src="http://annotator.com?webpagequery="+q;
        i.name ="rowzSearchIFrame";
        n.appendChild(i);

        gBrowser.contentDocument.body.appendChild(n);
        //content.document.body.appendChild(n);     
        document.frames['rowzSearchIFrame'].location.href = 'http://annotator.com?webpagequery='+q;
        alert(document.frames['rowzSearchIFrame'].id);

        document.frames['rowzSearchIFrame'].location.href = 'http://annotator.com?webpagequery='+q;

        document.getElementById('rowzSearchIFrame').setAttribute('src','http://annotator.com?webpagequery='+q);
        content.document.getElementById('rowzSearchIFrame').setAttribute('src','http://annotator.com?webpagequery='+q);


        document.getElementById('rowzSearchIFrame').src = 'http://annotator.com?webpagequery='+q;
        content.document.getElementById('rowzSearchIFrame').src = 'http://annotator.com?webpagequery='+q;
}