前提
ワードプレス記事内の指定した特定語句にjQueryを使って自動で<span>タグとクラスを付与することによって自動で特定語句をハイライト(強調)しています。
このコードはjavascript.js内に記述しており全てのページに反映されます。
実現したいこと
①類似した語句に自動で<span>タグを付与しないようにしたい(これは正直難しい)
②もっと簡単な方法で特定ページでは動作しないようにしたい
発生している問題・エラーメッセージ
①下記例の場合、
"トロ"という語句に<span>タグを付与している場合、
"トトロ"という語句がくると"トロ"だけ反応してしまい トトロ のように意図せぬ場所でハイライトされてしまいます。
②数百あるページのうち数ページはハイライトが不要なのですが
javascript.jsに記述してある為、不要でも無効化することができません。
全ての個ページにそれぞれ記述すれば解決しますがハイライトが必要/不必要なページの比率的に現実的ではありません。
### 該当のソースコード jQuery().ready(function($) { $('p').each(function() { var txt = $(this).html(); $(this).html(txt .replace(/トロ/g,'<span class = "Ptext">トロ</span>') .replace(/サーモン/g,'<span class = "Ptext">サーモン</span>') .replace(/トト/g,'<span class = "Ptext2">トト</span>') ); }); });
試したこと
①クラス名は適当ですがこの場合、トロという語句に対してPtextで強調したい色やサイズでcssを指定します。
次にトトロで反応しないようにトトという語句に対してPtext2で通常フォントを指定して他の語句も見つけ次第展開していきます。
②ハイライト不要ページ内ではPtextを全てPtext2に書き換えて記述します。
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2023/01/16 12:36
2023/01/17 04:12
2023/01/19 05:09