18

次のシナリオがあります。

  • メインページ
  • ネストされたページ
  • 共通のJSファイル（両方のページに含まれています）

ネストされたページは、その後メインページのiframeに読み込まれます。両方のページは、ページのロード時に共通のJSファイルから関数を呼び出します。

ライブデモ：
http ：//www.ecmazing.com/misc/pause-execution/mainpage.html
http://www.ecmazing.com/misc/pause-execution/nestedpage.html
http://www.ecmazing.com /misc/pause-execution/common.js

共通のJSファイルには、H1要素を赤くペイントする1つのグローバル関数が含まれています。その関数の開始時に実行を一時停止して、H1要素がまだ黒である間に実行を一時停止したいと思います。

メインページでそれを行う方法：

これは些細なことです。ページをロードし、ブラウザーの開発ツールを開いて、common.jsファイルを選択し、関数の最初の行にブレークポイントを設定するだけです。次に、ページをリロードします。ブレークポイントはリロードを永続化し、実行は一時停止されます。

ネストされたページでそれを行う方法：

現在、ChromeとFirefox（Firebug）では、上記で設定されたブレークポイント（メインページ用）は、ネストされたページでも機能します。両方のページが同じJSファイルを使用し、そのファイルにブレークポイントを設定すると、両方のページに自動的に適用されます。残念ながら、このルールはIEには適用されません。

さらに悪いことに、後でブレークポイントを設定し、iframeのみをリロードしても、ブレークポイントは持続しません。

そのため、IEでネストされたページの実行を一時停止する方法がわかりません。できますか？（関数の先頭に手動でaを設定することでこれに対処していdebugger;ますが、可能であれば、IEの開発ツールを使用してブレークポイントを設定できるようにしたいと思います。）

4

7 に答える 7

4

解決策に最も近いのは、メインページのloadIFrame（）関数内にブレークポイントを設定し、ネストされたページのCommon.jsファイルが読み込まれるまで「ステップイン」することです。より複雑な例では、新しいCommon.jsファイル内にブレークポイントを設定でき、次にiframeが読み込まれるまでブレークポイントが正しく機能し、すべてが再び失われます。

于 2012-05-25T11:53:33.023 に答える
3

テストするIE9はありませんが、common.jsファイルをiframeページの個別のアセットとして扱うことができますか？これらのファイルはブラウザによって何らかの方法でタグ付けまたはラベル付けされる必要があるため、他のブラウザでも機能するのはそのためだと思います。

例として、iframeページ?iframePageの最後に追加します。common.js少なくともFirefoxでは、アセットがとしてロードされていることが示されていcommon.js?iframePageます。クエリ文字列を超えるものはすべてブラウザによって無視されますが、それ以外の場合、JavaScriptはその正確な名前でロードされます。

もう1つの例は、コピーを作成しcommon.jsて名前を変更しcommonClone.js、iframeページで使用することです。

どちらの例でも、IE9でブレークポイントを2回（アセットごとに1つずつ）設定できる場合があります。

とはいえ、親ページが使用しているファイルに依存しないiframeのみのブレークポイントを作成することを妨げるものは何もありません。このメソッドは、並列ブレークポイントと呼びます。これにより、 iframeページと親ページからJavaScriptの非同期デバッグが可能になります。 JavaScriptを独立して処理していますが、連携して動作している可能性があります。common.js

このメソッドのリファレンスは、公式ソースのMSDNライブラリからのものです。複数のJavaScriptファイルでブレークポイントを実行する方法を示す「ブレークポイントの管理」セクションの「F12開発者ツールを使用したJavaScriptエラーのデバッグ」セクション。

IE9 Developers Forumの最近のフォーラム投稿によると、デバッグに使用するときにJavaScriptファイルの再読み込みを防ぐための解決策は、次の例に示すように、 attachEventの代わりにインラインイベントハンドラーを使用することです。

replace (or comment it out)

$(document).onload(function(){ mycustomonload functions});

with

<body onload="mycustomonload functions">
于 2012-05-25T03:43:29.833 に答える
1

互換性テストのためだけにこれを行っている場合は、Chrome用のIETabプラグインを使用してみましたか？

これにより、IEのレンダリングエンジンがエミュレートされ、Chromeデバッガーを使用できるようになります。

これが十分でない場合は、行き詰まっていると思います。IE開発ツールは十分に洗練されていません。

于 2012-05-20T13:45:10.470 に答える
1

おそらく、HtmlコードとJavaScriptコードを再構築できればcommon.js、親ページからのみ参照でき、メインページとネストされたページの両方で同じJavaScript関数を使用できるようになります。

そうすれば、1つのブレークポイントが両方のシナリオを満たします。

于 2012-05-24T07:39:37.067 に答える
1

IEでiframeをデバッグし、ブレークポイントを設定して保持できるようにするには、iframeアドレスを独自のタブ/ウィンドウで開くことができます。ただし、iframeがその親と通信する場合、これは不可能/簡単です。

于 2012-05-24T12:42:59.290 に答える
1

少なくともIEDebuggyBarを使用していることを願っています。このコードでcommon.jsファイルを更新します

function func () {
    if(typeof window.parent.debug !== "undefined"){
        window.parent.debug();
    }
    document.getElementsByTagName( 'h1')[0].style.color = 'red';
}


function debug(){
    var a = "break here";
}

var a = "break here";メインページが読み込まれた後、ブレークポイントをに設定します。Load Iframeボタンを押すと、jsはその行で停止します。コールスタックを使用して、nestedpage.htmlのcommon.jsファイルにあるはずの前のjavascript命令（行）に移動します。次に、任意の場所に別のブレークポイントを設定し、デバッガーで[続行]をクリックするか、STEP機能を使用します

==更新===

ところで、あなたの質問に答えるために、なぜブレークポイントをiframeで永続化できないのか、このように考えてください。[Load IFrame]ボタンをクリックするたびに、windowオブジェクトの古いインスタンスがメモリに配置され、すべてのブレークポイントと新しいcommon.jsインスタンスで新しいインスタンスが作成されます。あなたが電話する場合も同じことが起こりますwindows.open("http://......");

また、両方window(s)に同じファイルがロードされている場合でも、ブラウザの2つの異なる実行フレームにロードされることに注意してください。同じブラウザの2つのブラウザインスタンスを実行できますが、ウィンドウに同じページが表示されません。クッキーのように共有されるものもありますが、それはこのトピックの範囲外です。

于 2012-05-27T04:40:35.267 に答える
0

setTimeout（）を使用して、特定の時間のJavaScriptを一時停止できます。

于 2012-05-26T12:48:38.623 に答える