javascript - innerHTML.repalce を使用してテキストを img 要素に置き換える

Question

Gmail チャットにスマイリーを追加するスクリプトを作成しています。
その部分的な作業、私は innerHTML.replace メソッド @line 33 で立ち往生してい

ます ご覧のとおり、replace メソッドの正規表現は変数を使用して渡されます。これは、スクリプトが窒息している場所です。
変数を実際の正規表現に置き換えると、正常に動作します:|

Answer 1

各タイムアウト クロージャは、現在の反復の値ではなく、2 つの変数の最新の値になります。コードには反復が 1 つしかありませんが、投稿用に単純化されているだけだと思います。次のように変更できます。

for(var i = smileys.length-1; i >= 0; i--) {
    (function(i)
    {
        var smileyRegex = smileys[i][0];
        var smileySrc = smileys[i][1];
        if(node.textContent.match(smileyRegex)) {
            log('match');
            window.setTimeout(function(){
                log(node.innerHTML); log(node.innerHTML.replace(smileyRegex, '<img class="smiley_ext" src="'+smileySrc+'">'));
            },1000);
        }
    })(i);
}

このように、各反復ステップには独自の変数セットがあります。ただし、実際にタイムアウトが必要かどうかはわかりません。

Answer 2

それ以外の

window.setTimeout(function(){
    log(node.innerHTML); 
    log(node.innerHTML.replace(smileyRegex, '<img class="smiley_ext" src="'+smileySrc+'">'));
},1000);

使用する

(function(smileyRegex, smileySrc) {
    window.setTimeout(function(){
        log(node.innerHTML); 
        log(node.innerHTML.replace(smileyRegex, '<img class="smiley_ext" src="'+smileySrc+'">'));
    },1000);
})(smileyRegEx, smileySrc);

これにより、値へのスコープ参照が作成されるため、ループの影響を受けません。