4

空のdiv要素があります:

<div class="message"></div>

Web ページの特定のポイントで、pタグが div に動的に追加されます。

<div class="message">
  <p>Some Message</p>
</div>

pを削除してから、再度追加することができます。

div.messageにp子があり、コードを実行する場合、リッスンするにはどのイベントを使用すればよいですか?

この質問を見つけましたが、外部プラグインが関係しています。

これを達成する簡単な方法はありませんか？

4

2 に答える 2

9

実装と変更を認識する必要がある速さによっては、 を使用しsetIntervalて特定の要素の内容を定期的に監視することで解決できる場合があります。

var checkContents = setInterval(function(){
  if ($("div.message p").length > 0){ // Check if element has been found
    // There is a <p> element in here!!
    console.log($("div.message p").length());
  }
},1000);

前のスニペットは、<p>要素内のdiv.message要素を毎秒 (1000 ミリ秒) チェックし、存在する場合はそれらの数をコンソールに記録します。

ブラウザーのサポート要件によっては、代わりに突然変異イベントを使用することもできます -

Mutation イベントは、Web ページまたは拡張機能が DOM に加えられた変更について通知を受けるためのメカニズムを提供します...

var element = document.querySelectorAll('div.message')
element.addEventListener("DOMNodeInserted", function (ev) {
  // ...
}, false);
于 2012-12-22T12:14:29.427 に答える