jquery - 特定の単語をタグでラップするjQuery

Question

score 6 · Accepted Answer

次のようなことができます。

$("p").each(function() {
    $(this).html($(this).html().replace(/contracting/g, "<strong>contracting</strong>"));
});

score 1 · Accepted Answer

<span> <div>これを機能させるには、置き換えるコンテンツを ID のあるもので囲む必要があります。

HTML:

<div id="content">Contracting</div>

JS:

content=document.getElementById("content");

content.innerHTML=content.innerHTML.replace(/contracting/gi,"<strong>$&</strong>");

JSfiddle は機能しますが、フォントは変更されません。要素を調べて (Contracting を右クリックし、要素を調べる)、強いタグがあるかどうかを確認する必要がある場合があります。

score 0 · Accepted Answer

これはどう？

var yourElement = $("#your-element-selector");

yourElement.html(yourElement.html().replace("yourword", "<strong>yourword</strong>"));

score 0 · Accepted Answer

(function(){

$("p").each(function() {

var self = $(this);

self.html(self.html().replace(/contracting/gi, "<strong>$&</strong>"));

})

})()

;

score 0 · Accepted Answer

これを行う小さなプラグインを作成しましたが、現在、コンテンツをリセットせずに同じ要素で複数回効果的に使用できないというバグがあります。ここに jsfiddle があります: http://jsfiddle.net/NFDqe/1/

$("#content").highlightText("contracting","bold",true);

boldこの場合、あるテキストをラップしているスパンに追加されるクラスです。font-weight: bold

私が持っているバグなしで同じことをする別のプラグインを見つけたとしても、私は驚かないでしょう.

アップデート

また、スパンタグの代わりに強力なタグを取得するようにdefaultTagNameプラグインを設定することもできます。strong

$.fn.highlightText.defaultTagName = "strong";
$("#content").highlightText("contracting",true);

.html() メソッドよりもこのメソッドを使用する利点は、タグ内またはフォーム入力の値内にある可能性があるクラス名または ID に触れないことです。#contentに置き換えることで、ページ全体に影響を与えることができますbody。

アップデート

また、の代わりに"contracting"、次のような正規表現を渡すことができます/contracting/ig

5 に答える 5