4

次のような特定の HTML 要素があるとします。

<div id="foo">...</div>

その要素の内部では、高さや固定位置など、その要素の一部の表示構成を変更する多くのことが発生する可能性があります。

その要素の表示に関連する変更を追跡できる方法はありますか? 要素が表示変数を変更したときに発生する一般的なイベントはありますか?

4

3 に答える 3

5

次のようなものを使用するだけです。

MutationObserver = window.MutationObserver || window.WebKitMutationObserver;
var observer = new MutationObserver(function(mutations, observer) {
    // fired when a mutation occurs
    console.log(mutations, observer);
    // Use of the information here.
});

observer.observe(document, {
  subtree: true,
  attributes: true
  //...
});

への呼び出しでMutationObserver、イベントをリッスンし、変数の変更で変更された要素のリストを取得できます。

の最初の引数で、observer.observeリッスンする要素を設定できます。同じメソッドの 2 番目の引数で、何を聞きたいかを設定できます。

このコードは、Chrome、Firefox、および Safari で動作します。他のブラウザでは、変更された属性のみを表示したい場合などに、'DOMAttrModified'やなどのイベントを使用できます。'propertychange'

幸運を。

于 2013-05-08T17:27:20.993 に答える
1

突然変異イベントを参照しているようです(潜在的に関連する質問hereで見つかりました)。お気づきかもしれませんが、ほとんどの変更の追跡は入力要素に集中しています。

私はこれまでこれらを適切に使用したことがないので、実装について多くを提供することはできません. お役に立てれば！

于 2013-05-08T17:25:39.157 に答える
0

イベントを追跡することは不可能だと思います。イベントの完全なリストは次のとおりです: http://www.quirksmode.org/dom/events/index.html

于 2013-05-08T17:24:08.377 に答える