4

ChromeのWebインスペクターでは、DOM要素を右クリックすると、[HTMLとしてコピー]オプションがあり、通常、その要素とそのすべての子のHTML文字列が表示されます。ただし、インスペクターに子ノードとして表示されているにもかかわらず、IFrameタグのコンテンツが含まれているようには見えません。

この問題は、クロスドメインの制限が原因ではありません。同じドメインのIFrameでさえ、コピーされたHTMLから除外されます。

ネストされたすべてのIFrameのHTMLルートをコピーして貼り付け、テキストエディタで手動でつなぎ合わせる以外に、これを回避する方法はありますか？私はサードパーティの広告スクリプトがネストされたIFrameの大きくて広大なツリーを生成することが多いサイトで働いています。同僚がその構造をコピーして貼り付けて、物理的に座っていなくても広告の問題をデバッグできるようにする方法が必要です。彼らの机で。

4

3 に答える 3

3

Google Chromeはブラウザ内のどこかで動作をハードコーディングしていると思いますが、コードのセクションを見つける時間がありません。

これは、グーグルクロームを使用してウェブページ上に現在あるすべてのiframeからhtmlを取得する回避策です。

設定：

  • すべてのGoogleChromeブラウザを閉じてから、ウェブセキュリティを無効にしてGoogleChromeを起動します。そうしないと、実行DisplayIframeContent.jsすると次のようなエラーが発生します。
安全でないJavaScriptがURLを使用してフレームにアクセスしようとしています...

例：

cd LOCATION \ OF \ GOOGLE \ CHROME
chrome.exe --disable-web-security

Google Chromeが読み込まれると、次のような黄色の警告が表示されます。

サポートされていないコマンドラインフラグ--disable-web-securityを使用しています。安定性とセキュリティが損なわれます。

使用法：

  • Google Chromeを起動した後、テストWebサイトを開きます。
  • を押しF12てdevtoolsを開きます。
  • jQueryのコンテンツをコピーしてコンソール内に貼り付けます。
  • DisplayIframeContent.jsコンソール内にコピーして貼り付けます。

DisplayIframeContent.js

// @author Larry Battle <bateru.com/news> 12.13.2012
// requires jQuery 1.8.3+
clear();
if( !$("iframe").length ){
    console.log("No iframes were found");
}else{
    $("iframe").each(function (i) {
        console.log( "### iframe[%s].src = (%s)", i, $(this).attr("src") );
        console.log( $(this).contents().find("html").html() )
    });
}
"done";
  • コンソールからの出力をコピーして貼り付けます。

期待される出力：

URLの例：http：//jsfiddle.net/28yrA/ 出力：

### iframe[0].src = (javascript:false)
...HTML...
### iframe[1].src = (javascript:false)
...HTML...
### iframe[2].src = (javascript:false)
...HTML...
### iframe[3].src = (http://fiddle.jshell.net/28yrA/show/)
...HTML...
"done"
于 2012-12-14T00:20:35.193 に答える
1

私はついに、DW-devによるSavePageWEと呼ばれるChrome拡張機能を介して解決策を見つけました。

https://chrome.google.com/webstore/detail/save-page-we/dhhpefjklgkmgeafimnjhojgjamoafof

Firefoxでも利用できます。 https://addons.mozilla.org/en-US/firefox/addon/save-page-we/

于 2020-01-22T16:02:19.483 に答える
0

他の答えはうまくいくかもしれませんが、HTMLをコピーするためだけにセキュリティを無効にするのは好きではありません。

ここでは、IMHOの方法を単純化した別の方法を紹介します。

最初に要素を検査し、要素をコピーして、iframe追加する場所に貼り付けます。

結果は、すべての属性を持つ空のiframeタグになります。

<iframe src="src"></iframe>

その中にiframe手動でと入力する#documentと、次のDOCTYPEようになります。

<iframe>
    #document
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
</iframe>

iframe内のドキュメントの親ノードをhtmlとしてコピーすると、通常のhtmlページをコピーする場合と同じように、すべての子がコピーされます。

Doctypeの下に貼り付けるだけで、全体が完成しますiframe。最終結果は次のようになります

<iframe>
    #document
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
        <!-- All the child nodes -->
    </html>
</iframe>
于 2015-04-17T22:03:00.620 に答える