6

コードをベースにして、追加のプラグインを使用せずに一致するアイテムを強調表示することは可能ですか?

style="backgorund: green;"アイテムが見つかった divに追加して、すぐに表示できるようにしたいと思います。

これまでに試したことはうまくいかなかったので、脳の外からの新しい考えがうまくいくことを願っています.

function finder(items){
    var needed = [
         /* items */
    ];
    var re = new RegExp(needed.join("|"), "i");
    return(items.match(re) != null);
}

var found = finder(document.body.innerHTML);
var output = found ? "found" : "not found";

if(output == 'found') {
    //highlight found array item
}
4

4 に答える 4

1

innerHTMLイベントを置き換え、DOM の生成を何度もトリガーするため、使用は悪です。陥る落とし穴が他にもあるため、既存のプラグインを使用することをお勧めします。カスタム正規表現を強調するためにmark.jsを見てください。

于 2016-05-21T14:18:28.700 に答える
1

replace() で何かを試すことができます

for (var i = 0; i < needed.length; i++) {
    var word = needed[i];
    document.body.innerHTML = document.body.innerHTML.replace(word, '<span style="background: #00ff00">' + word + '</span>');
}

ここで試してみてください: http://jsfiddle.net/4kjuw/

于 2012-12-21T12:53:11.380 に答える
1

なぜ車輪を再発明するのですか？これにはすぐに使える解決策があります。たとえば、このプラグインを試してください。プラグインのソースコードはこちら。これは文字通り数行のコードなので、独自の強調表示エンジンを書きたい場合は、それを分析して強調表示がどのように実行されるかを確認できます。

于 2012-12-21T12:51:34.367 に答える
-1

コードを少し変更して、次のように解決しました。

function finder(items){
    var needed = [
         /* items */
    ];
    var reg = new RegExp(needed.join("|"), "i");
    var found = (textToCheck.match(reg) != null);
    var foundItem = textToCheck.match(reg);
    return [found,foundItem];
}

var found = finder(document.body.innerHTML)[0];
var foundItem = finder(document.body.innerHTML)[1];

if(found === true) {
    $('div:contains('+foundItem+')').css("background", "greenyellow");
}
于 2012-12-21T23:44:16.850 に答える