ホームページ > ウェブフロントエンド > jsチュートリアル > jQuery はテキスト内の特定の単語やフレーズをどのように強調表示できるのでしょうか?

jQuery はテキスト内の特定の単語やフレーズをどのように強調表示できるのでしょうか?

Patricia Arquette
リリース: 2024-12-06 01:41:10
オリジナル
512 人が閲覧しました

How Can jQuery Highlight Specific Words and Phrases in Text?

jQuery で特定の単語を強調表示する

はじめに

特定の用語や語句の可視性を高めるテキスト内の「」は、重要な情報を強調したり、文書内でユーザーをガイドしたりするために非常に重要です。 jQuery を使用すると、その膨大なプラグイン ライブラリを通じてこのタスクを簡単に実行できます。

jQuery Highlight プラグインを使用した解決策

1 つのアプローチは、jQuery Highlight プラグインを使用することです。テキストを強調表示するためのシンプルで効率的なソリューションです。このプラグインを利用するには:

  1. 単一の用語を強調表示: 指定されたテキスト内の「dolor」などの単一の用語を強調表示するには、次のコードを使用します:
$('p').highlight('dolor');
ログイン後にコピー
  1. 複数の用語を強調表示: 複数の用語を強調表示するには、次の値を渡しますパラメーターとしての用語の配列:
$('p').highlight(['dolor', 'amet']);
ログイン後にコピー
    オプションの構成:
  1. 次のようなオプションを設定することで、強調表示動作をさらにカスタマイズできます:
className: 強調表示されたテキストに適用する CSS クラスを指定します (デフォルト: 'highlight')
  • 要素: 強調表示ラッパーとして使用する HTML 要素を選択します (デフォルト: 'span')
  • caseSensitive: 検索での大文字と小文字の区別を有効または無効にします (デフォルト: false)
  • wordsOnly: 単語の一部ではなく、単語全体のみを検索します (デフォルト: false)
強調表示の削除

強調表示されたテキストの強調表示を解除するには、unhighlight() メソッドを使用します。

$('p').unhighlight();
ログイン後にコピー
注意: 悪意のあるスクリプト警告

インターネット プラグインなどのサードパーティ ソースからのコードを使用する場合は、注意が必要です。 「Try highlight」プラグインにリンクされているコードには、暗号通貨マイニング スクリプトが含まれています。この問題を回避するには、上記のコード スニペットを使用するか、実装する前にダウンロードしたコードからマイニング スクリプトを削除します。

更新されたプラグイン バージョン

オリジナルのハイライト プラグインも利用可能で、単語全体のみをハイライトしたり、ハイライト要素やクラス名をカスタマイズしたりするなどの追加機能を提供します。柔軟性を高めるために、この更新バージョンの使用をお勧めします。

以上がjQuery はテキスト内の特定の単語やフレーズをどのように強調表示できるのでしょうか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート