問題タブ [mutation-events]

私は常に DOMNodeInsertedIntoDocument/DOMNodeRemovedFromDocument イベントがバブルすべきではないと考えてきましたが、私にとっては十分な意味がありました。しかし、つい最近、もう一度仕様を調べたところ、ある場所ではこれらのイベントがバブルしてはならない (イベント タイプの完全なリスト) と書かれているのに対し、別の場所ではバブルすべきである ( DOMNodeInsertedIntoDocumentとDOMNodeRemovedFromDocument ) と書かれていることがわかりました。

また、インターネットを調べたところ、いくつかの実装が見つかりました。それらはすべて、実装されている動作が異なります。

問題は、これらのイベントが実際にバブルするべきか、バブルしないべきかということです。もっと理にかなっていると思いますか？

更新: DOM-Level-2-Events仕様では、これらのイベントが単一の場所で言及されているため、あいまいさがないことがわかりました。

更新 2 : この質問は、すべての標準ベースのテクノロジを実装することを目的としたAmple SDK Ajax フレームワークでのこれらのイベントの動作を検証するために行われました。

onpropertychangeJavaScriptを使用してFirefoxでテキストボックスのを処理するにはどうすればよいですか？

以下に例を示します。

jQueryを使用してデータを変更し、HTMLを使用してデータを表すWebアプリケーションを作成しています。ドキュメントには、単一のデータノードに関連する複数の表現が含まれる場合があります。ユーザーはそれらを動的に作成できます。たとえば、データは表で表され、変更できます。さらに、ユーザーは、特定のデータにすばやくアクセスするために「クイック概要パネル」を拡張するという意見を持っています。

1つのユーザーコントロールがイベントをトリガーする場合=>データを変更する必要があります=>同じデータに関連する他のユーザーコントロールを更新する必要があります。

実際の問題は、各ユーザーコントロールが独自の変更を処理することです。変更コンテンツハンドラーはデータ修飾子を認識している必要があるため、表現の更新をスキップできます。この種の問題に対する既存の一般的な解決策はありますか？そうでない場合は、良い解決策の提案をすることができますか？

ページ上のすべてのアンカータグにイベントリスナーを追加するFirefox拡張機能を作成しています。基本的に私は持っています：

これは、ページ上のほとんどのタグで機能します。問題は、javascriptで追加されたタグがイベントリスナーをアタッチしないことです。createElementを再定義してみました：

DOM挿入リスナーを追加してみました

しかし、どちらも機能しません。これらのアンカーオブジェクトへの参照を取得して、リスナーを追加するにはどうすればよいですか？

ありがとう

この DOM イベントを活用する必要があります。IE には onpropertychange があり、必要なことも実行します。ただし、Webkit はこのイベントをサポートしていないようです。私が使用できる代替手段はありますか？

タイマーを使用して時間の経過とともに要素の数をカウントし、変化を探す以外に、このイベントをシミュレートするより良い方法は思いつきません。

ある種の独自の IE バージョンの DOMNodeInserted はありますか? ありがとう。

DOM への変更を検出するための効率的なメカニズムが必要です。できればクロスブラウザですが、クロスブラウザ以外で有効な手段があれば、フェールセーフなクロスブラウザ方式で実装できます。

特に、ページ上のテキストに影響を与える変更を検出する必要があるため、新しい要素、削除された要素、変更された要素、または内部テキスト (innerHTML) の変更が必要になります。

行われる変更を制御することはできません (サードパーティの JavaScript インクルードなどが原因である可能性があります)。この角度からアプローチすることはできません。何らかの方法で変更を「監視」する必要があります。

現在、定期的にチェックする「quick'n'dirty」メソッドを実装しましたbody.innerHTML.length。もちろん、これは同じ長さが返される変更を検出しませんが、この場合は「十分」です。これが発生する可能性は非常に低く、このプロジェクトでは、変更の検出に失敗することはありません。失われたデータで。

問題body.innerHTML.lengthは、それが高価なことです。高速なブラウザでは 1 ～ 5 ミリ秒かかることがあります。これにより、動作が大幅に遅くなる可能性があります。また、膨大な数の iframe を扱っているため、すべてが加算されます。これを行うことのコストが高いのは、innerHTML テキストがブラウザーによって静的に保存されず、読み取るたびに DOM から計算する必要があるためだと確信しています。

私が探している答えの種類は、「正確」(イベントなど) から「十分に良い」ものまで、おそらく innerHTML.length メソッドのように「クイックアンドダーティ」なものですが、より高速に実行されます。

編集:変更された正確な要素を検出することは「良い」ことですが、絶対に必要というわけではありません.変更があったという事実だけで十分です. これにより、人々の反応が広がることを願っています。Mutation Events を調査する予定ですが、IE サポートのフォールバックがまだ必要です。

最初のDOM解析中または解析前にDOMを変更することは可能ですか？または、DOMを操作する前に、DOMが解析および構築されるまで待つ必要がありますか？より具体的には、DOMのスクリプト要素がchromeまたはfirefoxのuserscripts / contentスクリプトまたは同様のものを使用して実行されるのを妨げることは可能ですか？

DOMが解析される前にDOMNodeInsertedでeventListenersを使用してみましたが、これらはDOMが構築された後にのみ起動されます。

html に div または input が追加されたときに関数を実行したい。これは可能ですか？

たとえば、テキスト入力が追加されたら、関数を呼び出す必要があります。

最新の Chrome ブラウザ用のユーザー スクリプトを作成しました。ロード後にスクリプトがページの変更されたコンテンツを取得できないようです (たとえば、ページがロードされた後、[sth?] をクリックすると埋め込みウィンドウがポップアップ表示されました)。

を使用window.setTimeout()しても、 を介してタイマー コールバックで更新されたコンテンツを取得できませんdocument.getElementById()。ページを調べたところ、popup 要素が DOM に存在することがわかりました。

これはユーザー スクリプトの制限ですか? または、ユーザースクリプトで更新を取得するために他の方法を使用できますか?

更新：DOMSubtreemodified提案どおりにイベント を試しました。しかし、動作はまだ奇妙です。

my.safaribooksonline.com のユーザースクリプトに、JavaScript を 1 行だけ追加しました。

しかし、アラート ボックスには、評価結果として「未定義」と表示されOpenSignInPopupます。しかし、同じページのスクリプト コンソールでアラート ステートメントを同時に実行し、結果を「関数」として表示することができます。

この関数は、ユーザー スクリプトが最初に実行されたときに読み込まれませんでした。では、ユーザースクリプトでどのように使用できますか?