質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
86.12%
Webサイト

一つのドメイン上に存在するWebページの集合体をWebサイトと呼びます。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

正規表現

正規表現とは特定の文字列によるパターンマッチングを行う際に用いられる宣言型プログラミングです。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

解決済

【WEB】文章中にある特定のキーワードの全てを自動的にリンク化する方法、あるいはグローバルマッチについてご教示ください

hiraganaobake
hiraganaobake

総合スコア6

Webサイト

一つのドメイン上に存在するWebページの集合体をWebサイトと呼びます。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

正規表現

正規表現とは特定の文字列によるパターンマッチングを行う際に用いられる宣言型プログラミングです。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

3回答

0リアクション

0クリップ

1493閲覧

投稿2020/09/02 15:56

編集2020/09/02 16:01

WEBサイトを作成しており、その一部の機能で文章中にある特定のキーワードを自動的にハイパーリンクにしたいと思ってます。(ウィキペディアのようなイメージ)

下記①のサイトを参考にし、コピペで自動でハイパーリンク化にできましたが、
先頭の該当するキーワードのみにしか反映できませんでした。

https://ascii.jp/elem/000/000/200/200581/

■現在の状態⇩
イメージ説明

全体に反映させるために、①サイト内に

 単語が多くなったときにリンクだらけになってしまうのを避けるため、今回はグローバルマッチ(文章全体)の置換処理はせず、最初に見つかったものだけをリンクにしています。もちろん、これまでと同様にgオプションを付加して全体を置換しても問題ありません。

とあったため、下記②のサイトの引用部分のことかと思い試してみましたが反映しませんでした。

https://ascii.jp/elem/000/000/200/200144/2/

最初のパラメータで「/未曾有/g」と指定していますが、パラメータには単純な文字列ではなく正規表現で使用できる文字列を指定します。今回は特殊な文字がないので、「/」と「/」の間に置換元になる文字列を指定するだけです。「/」の後にある「g」はグローバルマッチ (global match) で、指定すると文章全体にある該当文字が対象になります。ふりがなをつけるのは文章中の最初の1回だけでいい、という場合はgを外せばOKです。

また、①のサイトに下記ような記載があったのですが、
こちらも対応方法の一つかと思ったのですが、内容が理解できずにどのようにしたらいいのかわからない状況です。

また、repace()の最初のパラメータは「/~/」でなく「new RegExp()」とします。変数などを使用する場合には、「RegExp()」の最初のパラメータに置換(検索)文字を指定し、2番目のパラメータで"g"や"i"などオプションパラメータを指定します。2番目のパラメータは今回省略していますので、グローバルマッチは行なわれず、最初に見つかった単語だけにリンクを追加します。

どのようにしたら文章中にある特定のキーワード全てに自動的にハイパーリンク化できるかご教示お願いいたします。

下記現在のコードになります。

■html

<html> <head> <meta charset="utf-8"> <script type="text/javascript" src="http://code.jquery.com/jquery-3.1.0.min.js"></script> <script type="text/javascript" src="t1.js"> </script> <script type="text/javascript"> $(function () { $("body").addlink(); }); </script> <title>test</title> </head> <body> <h1 id="sampleDoc">テスト、試験、test</h1> <h3 id="sampleDoc">テスト、試験、test</h3> <p id="sampleDoc">テスト、試験、test</p> <a id="sampleDoc">テスト、試験、test</a> <div id="sampleDoc">テスト、試験、test</div> </body> </html>

■javascript

$.fn.addlink = function(baseURL){ var dict = [ "テスト", "http://ja.wikipedia.org/wiki/富士山", "試験","http://ja.wikipedia.org/wiki/京都市", "test","http://ja.wikipedia.org/wiki/秋葉原" ]; return this.each(function(){ var srcText = this.innerHTML; for (var i=0; i<dict.length; i+=2){ srcText = srcText.replace(new RegExp(dict[i]),"<a href='"+dict[i+1]+"'>"+dict[i]+"</a>"); } this.innerHTML = srcText; }); }

何卒よろしくお願いいたします。

以下のような質問にはリアクションをつけましょう

  • 質問内容が明確
  • 自分も答えを知りたい
  • 質問者以外のユーザにも役立つ

リアクションが多い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

気になる質問をクリップする

クリップした質問は、後からいつでもマイページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

下記のような質問は推奨されていません。

  • 間違っている
  • 質問になっていない投稿
  • スパムや攻撃的な表現を用いた投稿

適切な質問に修正を依頼しましょう。

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
86.12%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問

同じタグがついた質問を見る

Webサイト

一つのドメイン上に存在するWebページの集合体をWebサイトと呼びます。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

正規表現

正規表現とは特定の文字列によるパターンマッチングを行う際に用いられる宣言型プログラミングです。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。