3

私の質問は、なぜフレーズが赤いのかということです。の後の単語のみにする必要があります>。正規表現は正しいです(here

$(".some").html(function (i, text) {
    return text.replace(/([^>]*)$/, function (match) {
        return '<span class="red">' + match + '</span>';
    });
});

.red {
    color:#ff0000
}

<div class="some">RAW MATERIALS & CHEMICALS>Earth & Stone</div>

http://jsfiddle.net/Z4cMN/1/

4

3 に答える 3

4

text特殊文字が html エンコードされているため、 を探す必要があります&gt;

http://jsfiddle.net/trevordixon/Z4cMN/10/

$(".some").html(function (i, text) {
    return text.replace(/&gt;(.*)$/, function (match, title) {
        return '&gt;<span class="red">' + title + '</span>';
    });
});
于 2013-06-07T17:08:52.933 に答える
3

HTMLのようで、&エスケープ>されています。正規表現に渡す前に、文字のエスケープを解除してみてください。

$(".some").html(function (i, text) {
    return htmlDecode(text).replace(/([^>]*)$/, function (match) {
        return '<span class="red">' + match + '</span>';
    });

    function htmlDecode(input) {
        var e = document.createElement('div');
        e.innerHTML = input;
        return e.childNodes.length === 0 ? "" : e.childNodes[0].nodeValue;
    }
});

デモ: http://jsfiddle.net/fptbd/

于 2013-06-07T17:07:50.057 に答える
2

これを行うには、正規表現の方法よりも少し優れた別の方法があります。これは DOM の力を利用しています。したがって、ブラウザ自体が Web ページを理解する方法です。

var textnode = $(".some").contents().last().get(0), // get the last node in .some
    last = textnode.splitText(textnode.data.lastIndexOf('>') + 1); // split it after the last >

$(last).wrap('<span class="red"/>'); // wrap the newly-created node in a span

http://jsfiddle.net/Z4cMN/11/

これにより、HTML エンコーディングについて心配するよりも、より直感的な方法でテキスト データを使用できることに注意してください。

于 2013-06-07T17:14:00.837 に答える