0

この質問は、stackoverflow で何度か尋ねられましたが、私自身の状況に合った解決策をまだ見つけていません。

非推奨のコードlivequeryDOMNodeInserted. 以下に例を示します。

仕事で使用する必要があるサードパーティの Web サイトの JavaScript を開発しています。したがって、スクリプトを実行すると、ページが読み込まれ、サーバー上の js ファイルにアクセスできなくなります。IEのみを使用しており、現在のバージョンはIE11です。

livequery()「DOM の変更に対応する必要があり、それらの変更を引き起こしている jQuery を制御できないまれなケース」で役立つhere を読みました。これがまさに私の状況です。

私はこのようなことには完全に慣れていませんが、MutationEvents/Observers がこれを実行できることを読みましたが、IE と互換性がありません。とにかく、私が読んだことは、現時点では私の理解を超えています.

これが私がやろうとしていることです:

ユーザーがサードパーティ アプリのタブをクリックすると、そのタブのすべてが動的に作成されます。タブの読み込みがいつ終了したかを判断する必要があります。そのため、タブに要素が存在するかどうかを確認し、要素が作成されたときにタブが読み込まれたことを確認します。

この例では、タブに「s_3_1_12_0_icon」というアイコンが含まれています。

これらのコード スニペットは両方とも、目的の結果をトリガーします。

//Method 1: Using DOMNodeInserted
$('body').on('DOMNodeInserted', function () {
    var elementExists = document.getElementById('s_3_1_12_0_icon');
    if (elementExists != null) { 
        alert('The element has just been created')
        $('body').off('DOMNodeInserted');
    }
});

//Method 2: Using Livequery
$('#s_3_1_12_0_icon').livequery(function() {
    alert('The element has just been created')
    $('#s_3_1_12_0_icon').expire();
});

しかし、前述のように、livequery()およびDOMNodeInsertedは非推奨です。これを行う現代的な方法はありますか?

4

1 に答える 1

2

...MutationEvents/Observers がこれを実行できることを読みましたが、IE と互換性がありません...

IE9 と IE10 の両方に、古い非推奨のミューテーションイベントがあります(ほとんどの場合)。IE11 には新しいミューテーション オブザーバーがあります。これには間違いなくミューテーションオブザーバーを使用できます。

var observer = new MutationObserver(function() {
  if (document.getElementById('s_3_1_12_0_icon') != null) {
    var p = document.createElement('p');
    p.innerHTML = "It fired!";
    document.body.appendChild(p);
    observer.disconnect();
    observer = null;
  }
});
observer.observe(document.body, {
  childList: true,
  subtree: true
});
setTimeout(function() {
  var div = document.createElement('div');
  div.id = "s_3_1_12_0_icon";
  document.getElementById("descendant").appendChild(div);
}, 600);
<div>
  <div>
    <div id="descendant"></div>
  </div>
</div>
<p>In a moment, we'll add the element and see if the observer fires...</p>

(divは、 の直接の子である必要がないことを示すためにありbodyます。)

于 2015-03-23T20:06:21.980 に答える