JavaScript｜特定URLだった時、特定の要素を変更するコードの書き方を教えてほしいです

特定URLのパスと一致した時、特定要素を変更するコードの書き方を教えて欲しいです。

例えば各ページに「申し込み」というボタンがあるとして、/bbb/のページだけ、「申し込み無料」と変更する場合、JavaScriptでどのようなコードを書けば良いのでしょうか。

https://goo.ne.jp/aaa/ →申し込み
https://goo.ne.jp/bbb/ →申し込み無料
https://goo.ne.jp/ccc/ →申し込み

ちなみにJavaScript初心者で、HTMLはほぼ分かります。

質問者からの補足コメント

• 拙文にも関わらず、ご丁寧にご回答いただきありがとうございます。
  
  特定のURLという表現が間違っており、質問の意図が正しく伝わっておらずすみません。
  
  正しくは現在のURLのパス(ページ)がhttps://goo.ne.jp/bbb/だった場合、そのページ内の「申し込み」ボタンのテキスト要素を「申し込み無料」に変更したいという意味でした。

  No.1の回答に寄せられた補足コメントです。 補足日時：2023/08/26 19:02

No.2 回答者： fujillin 回答日時： 2023/08/26 20:19

No1です。

＞正しくは現在のURLのパス(ページ)がhttps://goo.ne.jp/bbb/だった場合～
表示しているページのURLという意味なら、
　location.href
で取得できます。
https://developer.mozilla.org/ja/docs/Web/API/Lo …

対象が変わるだけなので、あとは同様ですね。

この回答へのお礼

早々にご回答いただき、ありがとうございます。
さっそく教えていただいたコードで試してみます

お礼日時：2023/08/26 20:31

No.1 回答者： fujillin 回答日時： 2023/08/26 12:08

こんにちは

＞特定URLのパスと一致した時、特定要素を変更するコード
なさりたい内容によって、スクリプトは変わります。
『「何が」特定URLのパスと一致した時、「どの」特定要素「の何」を「どのように」変更するコード』
なのかによります。

イメージ的には
　if(比較するパス == 特定URLのパス) 特定要素.変更する属性 = 変更後の属性
みたいな感じでしょうか。

あるいは、要素そのものを別の要素に置き換えるのなら、
　if(比較するパス == 特定URLのパス) {
　　特定要素.insertAdjacentElement('afterend', 別の要素);
　　特定要素.remove()
　}
のような感じで可能でしょう。

とは言え、「比較するパス」をどこから取得するのか、「特定要素」をどのようにして特定するのかによって、実際のスクリプトは様々になると思われます。


＞例えば各ページに「申し込み」というボタンがあるとして、
＞/bbb/のページだけ、「申し込み無料」と変更する場合
「/bbb/のページ」というのが、そのページのアドレスなのか、リンク先等なのか不明ですけれど・・・
例えば、
　<a href="https://goo.ne.jp/bbb/" >
　　<button type="button" id="特定要素">申し込み</button>
　</a>
というソースがあって、「リンク先が特定パスなら、ボタンの表示内容を変更する」というのであれば、
　const btn = document.getElementById('特定要素');
　if(btn.parentNode.href == 'https://goo.ne.jp/bbb/')
　btn.textContent = '申し込み無料';
みたいな感じになります。