1

Web自動化ツールを開発しています（C＃ですが、このトピックはそれについてではありません..）。WebBrowser をブラウザーとして unsing し、いくつかの Web サイトに接続するツール。

Web サイトには動的コンテンツがあり、1 秒に 1 回更新されます。setTimeout を使用してコンテンツを更新する Web サイト。次に、DOM要素（テーブル）内のデータがWebサイトの更新コンテンツに応答しました。3 つの古い行を削除し、3 つの新しい行を挿入します。

私の目標は、このイベントのトリガーを作成することです。

確認したところ、ウェブサイトは を使用していませんdocument.write。私が理解しているように、サイトがコンテンツを変更できる方法がいくつかあります。最初はinnerHTMLプロパティですが、テーブルには4行あり、サイトは最初の行を更新/削除しません。したがって、別の方法はappendChildとremoveChildであり、より現実的です。だから私の質問は、どうすればこのアクションをトリガーできるのですか?

私が知っているように、DOM要素に対して独自の機能を定義することが可能です。では、appendChild および removeChild メソッドを再定義するにはどうすればよいでしょうか。

このような可能性はありますか?:

var realRC = contentTable.removeChild;
contentTable.removeChild = function(el){
alert("Trigged!");
realRC(el);
}
4

2 に答える 2

4

「トリガー」と言うときは、トリガーを意味すると思います。

トリガーする

ブラウザーのタイムアウトと間隔にはすべて ID があり、それらをクリアすることはできますが、直接トリガーすることはできません。最善の策は、setTimeout/setInterval ステートメントを探して複製することです。

イベントを聞く

とにかく汚れた道ときれいな道があります。次のテーブルにアクセスできるとします。

var target = document.querySelector('#some-id');

クリーンな方法は、DOM Mutation Observersを使用することです

// Example from MDN
var observer = new MutationObserver(function(mutations) {
  mutations.forEach(function(mutation) {
    console.log(mutation.type); // here you'll get the changes
  });    
});
// configuration of the observer:
var config = { attributes: true, childList: true, characterData: true };

// pass in the target node, as well as the observer options
observer.observe(target, config);

汚い方法は汚いチェックです

オブザーバーは本当に新しく、まだ問題があるため、より適切にサポートされ、より安定しています。.innerHTMLテーブルの値が変更されたかどうかを 16 ミリ秒ごとに確認します。

var oldHTML = "";
setTimeout(function(){
    if(target.innerHTML !== oldHTML){
        changed(); // changed is a function that you define and notify
    }
},16);

position/etc のような HTML の変更がある場合は、.textContent代わりに使用できます。

正直なところ、汚れた方法はよりシンプルで安定していますが、より醜いです。それでも私はそれを選びます。

于 2013-11-06T13:54:50.297 に答える
0

Benjamin Gruenbaum が解決してくれます) もっと読みやすくするために、ここに投稿してください!

var dataTable = document.getElementById("event_1538016");

dataTable.appendChild = function(node)
{
    console.log("trigged!");
    document.appendChild.apply(dataTable,[node]); // args is array!!
    return node;
}

mozillaで完璧に動作します！IE9+で動作することを願っています

于 2013-11-06T14:58:53.337 に答える