查找，更改頁面上文本的多個實例緩慢且無響應，但是可以

Question

編輯：保存我的問題后，StackOverFlow正在用翻譯替換日語字符。

這看起來就像我用相同的文本替換相同的文本。

（下面的騙子的第一項）應該是日語文本。

使用此處描述的腳本：

使用JavaScript小書簽，找到網頁中所有“舊”實例，並將每個實例替換為“新”

我已經嘗試翻譯Yahoo Japan Auction頁面（是的，我知道翻譯引擎存在，但是我有我的理由...）

示例頁面：

http://auctions.search.yahoo.co.jp/search?auccat=&p=bose&tab_ex=commerce&ei=UTF-8&fr=bzr-prop

嘗試了一些腳本，並且在腳本工作時，我必須等待幾次，然后單擊“無響應腳本”，然后才能進行更改（10到20秒）

雖然我可以確定自己的實現存在問題，但也不確定如何進行。 該腳本可以包含200多個更改項。 以下是出於空間考慮而挑選的。

版本1腳本：

function newTheOlds(node) {
    node = node || document.body;
    if(node.nodeType == 3) {
        // Text node
    node.nodeValue = node.nodeValue.split('Car,Bike').join('Car,Bike');
    node.nodeValue = node.nodeValue.split('Current $').join('Current $');
    node.nodeValue = node.nodeValue.split('Buy it Now').join('Buy it Now');
    node.nodeValue = node.nodeValue.split('Bid').join('Bid');
    node.nodeValue = node.nodeValue.split('Remaining Time').join('Remaining Time');
    node.nodeValue = node.nodeValue.split('Popular-Newest').join('Popular-Newest');
    } else {
        var nodes = node.childNodes;
        if(nodes) {
            var i = nodes.length;
            while(i--) newTheOlds(nodes[i]);
        }
    }
}

newTheOlds();

版本2腳本：

function htmlreplace(a, b, element) {    
    if (!element) element = document.body;    
    var nodes = element.childNodes;
    for (var n=0; n<nodes.length; n++) {
        if (nodes[n].nodeType == Node.TEXT_NODE) {
            var r = new RegExp(a, 'gi');
            nodes[n].textContent = nodes[n].textContent.replace(r, b);
        } else {
            htmlreplace(a, b, nodes[n]);
        }
    }
}


    htmlreplace('Car,Bike', 'Car,Bike');
    htmlreplace('Current $', 'Current $');
    htmlreplace('Buy it Now', 'Buy it Now');
    htmlreplace('Bid', 'Bid');
    htmlreplace('Remaining Time', 'Remaining Time');
    htmlreplace('Popular-Newest', 'Popular-Newest');
    htmlreplace('Display', 'Display');
    htmlreplace('Music', 'Music');
    htmlreplace('Hobby', 'Hobby');
    htmlreplace('Books/Mags', 'Books/Mags');
    htmlreplace('Antiques', 'Antiques');
    htmlreplace('Comics/Anime', 'Comics/Anime');
    htmlreplace('Movie/Video', 'Movie/Video');
    htmlreplace('Computers', 'Computers');
    htmlreplace('Others', 'Others');

我應該嘗試其他技術嗎？

謝謝，伍迪

Answer 1

雖然我可以確定自己的實現存在問題，但也不確定如何進行。

• 替換多個node.nodeValue =對documentFragment的分配
• 將多個htmlreplace調用中的字符串移動到鍵/值對象文字中
• 在documentFragment的childNodes上用Array.prototype.map調用替換循環
• 使用引用對象文字的替換回調來替換匹配項

參考文獻

• createDocumentFragment
• DOM文檔片段
• innerHTML的替代品
• 小型表排序器-或-您可以用JavaScript編寫LINQ