2

私は時々モーダルダイアログを作成するGreaseMonkeyスクリプトを書いています - のようなもの

<div id="dialog">
   Foo
</div>

. しかし、サイトに次のようなものがある場合、どうすればよいですか

#dialog {
    display: none !important;
}

? または、あるサイトの所有者が偏執的で、次のようなものを持っている可能性があります

div {
    display: none !important;
}
div.trusted {
    display: block !important;
}

彼は、私のような人が自分のページに信頼できないコンテンツを追加することを望んでいないからです. これらのスタイルがダイアログを非表示にしないようにするにはどうすればよいですか?

私のスクリプトはすべてのページで実行されるため、コードをそれぞれのケースに適応させることはできません。

ダイアログをサンドボックス化する方法はありますか?

4

2 に答える 2

1

実際には非常に興味深い問題です。別のアプローチを次に示します。

iframe を追加して変更すると、別の CSS スペースが作成されます (サンドボックス)

この jsfiddle の例を見てください: http://jsfiddle.net/ZpC3R/2/

var ele = document.createElement("iframe");
ele.id = "dialog";
ele.src = 'javascript:false;';
ele.style.height = "100px";
ele.style.width = "300px";
ele.style.setProperty("display", "block", "important");
document.getElementById("dialog").onload = function() {
    var d = document.getElementById("dialog").contentWindow.document;
    // ... do your stuff within the iframe
};

これはfirefoxでは問題なく動作するようです。

これで、iframe が変更されていないことを確認するだけで済みます。1. で説明した方法でこれを行うことができます。

于 2013-07-01T15:41:53.010 に答える
-1

次のようにdivを作成するだけです：

var ele = document.createElement("div");
ele.style.setProperty("display", "block", "important");

他のすべてのスタイルを上書きする必要があります。

ここを見てください、うまくいくようです：http://jsfiddle.net/ZpC3R/

于 2013-07-01T14:58:10.653 に答える