JavaScriptでURLの内容を取得する方法

JavaScriptでURLの内容を取得する方法
画像出典:MDN

JavaScriptを使ってURLの内容を取得する方法について説明します。

取得したい内容によって記述方法が違うので、目的に応じてそれぞれ記述方法を確認してみてください。

目次

URL全体を取得したい場合

//URL全体取得
const url = location.href

//出力結果
https://www.debriefing.jp/javascript-get-url

ドメイン(ホスト)を取得したい場合

//ドメイン(ホスト)の取得
const host = location.hostname;

//出力結果
www.debriefing.jp

パスを取得したい場合

//パスの取得
const path = location.pathname;

//出力結果
/javascript-get-url

URLのパラメーターを取得したい場合

//パラメーターの取得
const parameter = location.search;

//出力結果
?_ga=2.22355384.2034436735.1553910114-2128674471.1553910114

URLのアンカー(#以降)取得したい場合

//ページ内アンカーの取得
const anchor = location.hash;

//出力結果
#content1
目次