3

フォントファミリ（Arial）を、HTMLドキュメントに存在する「AAAAA」という単語に変更したいと思います。その単語はDBから何度も出てくる可能性がありますが、その1つの単語のフォントだけを置き換える必要があります。

JavaScriptでやると思います。誰かがそれを行う方法を知っていますか？

4

3 に答える 3

3

ジョージアが必要だとしましょう

  .geo{
    font-family:Georgia;
    font-style:italic;
    font-weight:bold;
    font-size:19px;
  }

デモ

var $els = $('body *'); // iterate through all elements // or define specific for performance.

$els.each(function(){ 
  $(this).html($(this).text().replace(/AAAAA/g, '<span class="geo">AAAAA</span>')); 
});

問題が発生する<span>可能性がある場合（DOMで一般的に使用されているように）...使用することをお勧めします<font>：<font class="geo">AAAAA</font>

于 2012-04-26T06:45:54.340 に答える
2 
$.fn.changeWord = function (str, className) {
    var regex = new RegExp(str, "gi");
    return this.each(function () {
        this.innerHTML = this.innerHTML.replace(regex, function(matched) {
            return "<span class='" + className + "'>" + matched + "</span>";
        });
    });
};

あれを呼べ

$('#myDiv').changeWord('specialWord', 'sw');

デモ。

更新： デモ。

于 2012-04-26T06:50:38.673 に答える
1 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            //$('body').replaceWith( $('<div></div>').append($(body).clone()).html().replace(/AAAA/g, '<span style="font-family: Arial; color:red;">AAAA</span>');


            //Or


            // global and case sensitive search in string
            $('#replaceTest2').replaceWith($('<div></div>').append($('#replaceTest2').clone()).html().replace(/AAAA/g, '<span style="font-family: Arial; color:red;">AAAA</span>'));
            // global and case insensitive search in string
            $('#replaceTest3').replaceWith($('<div></div>').append($('#replaceTest3').clone()).html().replace(/AAAA/gi, '<span style="font-family: Arial; color:red;">AAAA</span>'));
        });
    </script>
    <style type="text/css">
        body
        {
            font-family: Batang;
            font-style: italic;
            font-weight: bolder;
        }
    </style>
</head>
<body>
    <h1>
        Original Text
    </h1>
    <div id="replaceTest1">
        Hi.. testing <span style="font-family: Ebrima;">test aaaa</span>
        <div>
            <span style="font-family: Bookshelf Symbol 7; font-style: normal;">rreee AAAA </span>
            test
        </div>
    </div>
    <h1>
        Original Text Replace ( global and case sensitive search in string )
    </h1>
    <div id="replaceTest2">
        Hi.. testing <span style="font-family: Ebrima;">test aaaa</span>
        <div>
            <span style="font-family: Bookshelf Symbol 7; font-style: normal;">rreee AAAA </span>
            test
        </div>
    </div>
    <h1>
        Original Text Replace ( global and case insensitive search in string )
    </h1>
    <div id="replaceTest3">
        Hi.. testing <span style="font-family: Ebrima;">test aaaa</span>
        <div>
            <span style="font-family: Bookshelf Symbol 7; font-style: normal;">rreee AAAA </span>
            test
        </div>
    </div>
</body>
</html>
于 2012-04-26T07:19:54.330 に答える