location.pathnameの使い方


  1. 現在のURLのパスを取得する: location.pathnameを使って、現在のURLのパスを取得することができます。例えば、以下のコードでは、現在のURLのパスをコンソールに表示しています。
console.log(location.pathname);

このコードを実行すると、現在のURLのパスがコンソールに表示されます。

  1. 特定のパスに基づいた条件分岐: location.pathnameを使って、特定のパスに基づいた条件分岐を行うことができます。例えば、以下のコードでは、現在のURLのパスが"/about"の場合には特定の処理を行い、それ以外の場合には別の処理を行っています。
if (location.pathname === "/about") {
  // "/about"の場合の処理
  console.log("This is the about page.");
} else {
  // それ以外の場合の処理
  console.log("This is not the about page.");
}

このコードを実行すると、現在のURLのパスに応じて適切なメッセージがコンソールに表示されます。

  1. パスの一部を取得する: location.pathnameを使って、URLのパスの一部を取得することもできます。例えば、以下のコードでは、現在のURLのパスから最後のセグメント(/以降の部分)を取得しています。
const segments = location.pathname.split("/");
const lastSegment = segments[segments.length - 1];
console.log(lastSegment);

このコードを実行すると、URLのパスの最後のセグメントがコンソールに表示されます。

以上のように、location.pathnameを使うことで、現在のURLのパスに基づいた処理を行うことができます。これはフロントエンド開発において非常に便利な機能です。