メモ:パラメータの利用

URLに引数としてパラメータを設定し、それを取得して利用する方法のまとめ

パラメータ

「?」+「変数名(パラメータ)=値」でURLの最後に記述、複数は「&」で連結:
 ../../memo.html?id=1
 ../../memo.html?id=1&name=memo

パラメータの取得:locationオブジェクトのsearchプロパティを使用
 var urlParam = location.search;
 substring(1) や split("=" or "&") で変数名と値を分離して利用できる

アンカー(ハッシュ)の場合

「#」+「アンカー」でURLの最後に記述:
 ../../memo.html#memo

アンカーの取得:locationオブジェクトのhashプロパティを使用
 var urlHash = location.hash;

アンカーにタグのidを指定しておけば、そのタグの位置を表示させられる。
(ページ内遷移)

パラメータとアンカーを同時に指定もできる。
 memo.html?parameter#hash 〇
 memo.html#hash?parameter × ←全てアンカーとして認識されてしまう

パラメータを変えて同じhtmlファイルを表示

parent.htmlのコード


child.htmlのコード


jsファイルのコード


parent.htmlを表示



参考になったサイト

JavaScriptでURLのパラメータやアンカーを判断して処理を変更する方法
JavaScriptリファレンス > location.search