URLパラメータによってリンク先を変えたい

https://example.com/?param=aaa

のようなURLがあった場合に

param=aaaと時は
https://example.com/aaa/

param=bbbと時は
https://example.com/bbb/

のようにリンク先を変えたいのですが

現在は以下のような感じにしようと思っているのですが、
もっと効率的な書き方はありますでしょうか？
まだ調べてテストを繰り返している状態で下記のものが正常に動いているわけではないです…

html
1 <div class="link"></div>

js
1var urlParam = location.search.substring(1);
2if (urlParam == 'pid=ovt111') {
3    $('.link').append('<a href="https://example.com/aaa/" target="_blank"><img src="images/link_off.png" alt=""></a>');
4  } else {
5    $('.link').append('<a href="https://example.com/bbb/" target="_blank"><img src="images/link_off.png" alt=""></a>');
6  }

ご教示よろしくお願いいたします。

追記URLのパラメータは二種類しかないです。

行動規範の内容に同意します

回答2件

ベストアンサー

Javascript
1$(window).on('load',function()
2{
3	var url   = location.href;
4
5	console.log(url);
6
7	var param = url.replace(/.+?param=(.+)/g, '$1');
8
9	console.log(param);
10
11	$('.link').append('<a href="https://example.com/' + param + '/" target="_blank"><img src="images/link_off.png" alt=""></a>');
12});
13

こんなかな。

投稿2018/03/22 05:38

編集2018/03/22 05:40

退会済みユーザー

総合スコア0

MeB

2018/03/22 05:43

ありがとうございます！これの場合ってパラメータがなかった場合はimgなどが表示されないとおもうのですが、$('.link').append()の箇所をifなのでパラメータがなかった場合の時の記述する形でよろしいのでしょうか？

退会済みユーザー

2018/03/22 05:45

そうですね。$('.link').append()の前に、if(param==''){ return true; } を入れるとかですね。

行動規範の内容に同意します

javascript実行時にHTMLロードが完了していない事が原因ではないでしょうか？
以下のいずれかで正しく動作しますか？

$(document).ready(function(){...})などで該当コードを包む
該当のスクリプトを<BODY>の末尾に移動する

また、GETパラメータを判定するのであればlocation.search全体ではなく以下のコードを参考にパラメータpidの値を比較された方がよいですね。
https://qiita.com/Evolutor_web/items/c9b940f752883676b35d

投稿2018/03/22 04:28

退会済みユーザー

総合スコア0

MeB

2018/03/22 05:36 編集

回答ありがとうございます！記述の仕方は特に大きな問題はないということでよろしいでしょうか？

退会済みユーザー

2018/03/22 06:05

動作タイミングが適切であれば期待通りのHTMLコードが出るので、取り急ぎ問題はないと思います。ただ適切かという観点でいうと、改善すべき点があります。 SEARCHの完全一致で判定しているので他にパラメータがついたりして意図しない動作になるので、location.searchを分解し、適切なパラメータの内容のみを判定すべきですね。

行動規範の内容に同意します

あなたの回答