12

それで、私の問題の基本的な説明をします。

電話番号をタグのタイプでラップする拡張機能が現在（最終的に）機能しています。

現在動作していますが、ユーザーのアクションに基づいて、または ajax リクエストに基づいて JS を介して動的にロードされるものに問題があります。

たとえば、hotmail の電子メールをクリックして開くと、スクリプトが機能しますが、ページを更新して電子メールがコンテンツ スクリプトを読み込んで呼び出す場合に限られます。

ユーザーに拡張機能のアイコンをクリックさせることでこれを回避しようと考えましたが、それは実際には要求された機能ではありません。

Chromeでajaxリクエストをリッスンする方法がある場合（あるようです）http://code.google.com/chrome/extensions/webRequest.html それが私がやりたいことですが、方法がわかりませんこれを実装します。私はそれをリスナーとして扱いますか？

DOM がいつ変更されるかに基づいてこれを行う別の方法を考え出しましたが、そのためにロードに時間がかかり、DOM でそのように行うにはあまりにも多くのことが行われています。AJAX リクエストをリッスンし、終了したらコードを再度実行する必要があります。

任意のヘルプまたは正しい方向へのポインターでさえも素晴らしいでしょう =)

これがばかげた質問である場合は、よろしくお願いします。Google でフォームを検索して回答を探しましたが、何も見つからないようです。適切な質問をすることすらできない可能性があります。私は JavaScript を使い始めて 2 週間ほど経ちましたが、学習曲線は大雑把なものでした。

4

2 に答える 2

12

あなたが言う時...

DOM がいつ変更されるかに基づいて、これを行う別の方法を考え出しましたが、そのためにロードに時間がかかり、DOM でそのように行うにはあまりにも多くのことが行われています。AJAX リクエストをリッスンし、終了したらコードを再度実行する必要があります。

...Mutation Events または Mutation Observers をどこで使用していますか? オブザーバーはそれを修正する必要があると思ったからです。これまでに Observers で何もしたことがなく、Mutation Summaryを使用しました。ドキュメントの準備ができている/アイドル状態になるまで監視を開始しなかったことを除いて、必要なことを実行できるように見えたので (どちらかは不明)、ドキュメントの準備ができたらスキャンを実行してから、オブザーバーを起動する必要があるかもしれません。
私のテストコードは次のようになります（コンテンツスクリプト内）... 

handleChanges = function(summaries) {
    // There may be more things to ignore
    var ignore = {
        SCRIPT: true,
        NOSCRIPT: true, 
        CDATA: true,
        '#comment': true
    }
    summaries.forEach(function(summary) {
        summary.added.forEach(function(node) {
            if (!ignore[node.nodeName] || (node.parentNode && !ignore[node.parentNode.nodeName]) && node.nodeValue.trim()) {
                node.nodeValue='PAEz woz ere - '+node.nodeValue;
            }
        })
    })

}

var observer = new MutationSummary({
    callback: handleChanges,
    // required
    rootNode: document,
    // optional, defaults to window.document
    observeOwnChanges: false,
    // optional, defaults to false
    queries: [{
        characterData: true
    }]
});

XMLHttpRequest をチェックするもう 1 つの方法は、それをハイジャックすることです。単純に (ドキュメントの開始時のコンテンツ スクリプトで)..... 

function injectScript(source) {

    var elem = document.createElement("script"); //Create a new script element
    elem.type = "text/javascript"; //It's javascript
    elem.innerHTML = source; //Assign the source
    document.documentElement.appendChild(elem); //Inject it into the DOM
}

injectScript("("+(function() {

    function bindResponse(request, response) {
        request.__defineGetter__("responseText", function() {
            console.warn('Something tried to get the responseText');
            console.debug(response);
            return response;
        })
    }

    function processResponse(request,caller,method,path) {
        bindResponse(request, request.responseText);
    }

    var proxied = window.XMLHttpRequest.prototype.open;
    window.XMLHttpRequest.prototype.open = function(method, path, async) {
            var caller = arguments.callee.caller;
            this.addEventListener('readystatechange', function() {
                if (this.readyState === 4)
                    processResponse(this,caller,method,path);
            }, true);
        return proxied.apply(this, [].slice.call(arguments));
    };
}).toString()+")()");

...これは、超すごいSupper Happy Fun Blogではわかりません。
しかし、おそらくご存じのとおり、それは ajax 駆動型のサイトには十分ではありません。通常、サイトに固有のものを作成する必要があります。そうしないと、Mutation Observer がニーズを満たすでしょう。

于 2012-08-04T19:50:38.490 に答える
0

はもう機能していないMutationObserverため、これは を使用した更新された回答です。MutationSummary

var observer = new MutationObserver(function(mutationsList) {
  console.log(`Something has changed`);
});

observer.observe(document.querySelector('.whatever'), {
  attributes: true,
  characterData: true,
  childList: true,
  subtree: true
});
  • .whateverセレクターを興味のあるクラス/IDに変更してください。
  • セレクターの子の変更に関心がある場合は、必ずオプションで指定true/falseしてください。subtree
于 2020-09-19T17:27:50.433 に答える