初心者でも分かる！JavaScriptでURLに文字列が含まれているかどうかをチェックする3つの方法

2024-04-02

URLに特定の文字列が含まれているかどうかを確認する方法

JavaScript、jQuery、およびURLを使用して、URLに特定の文字列が含まれているかどうかをチェックする方法はいくつかあります。

方法

indexOf() メソッド

const url = "https://example.com/search?q=javascript";
const searchTerm = "javascript";

if (url.indexOf(searchTerm) !== -1) {
  console.log("URLに検索ワードが含まれています");
} else {
  console.log("URLに検索ワードが含まれていません");
}

includes() メソッド

const url = "https://example.com/search?q=javascript";
const searchTerm = "javascript";

if (url.includes(searchTerm)) {
  console.log("URLに検索ワードが含まれています");
} else {
  console.log("URLに検索ワードが含まれていません");
}

match() メソッド

const url = "https://example.com/search?q=javascript";
const searchTerm = "javascript";

const result = url.match(searchTerm);

if (result) {
  console.log("URLに検索ワードが含まれています");
} else {
  console.log("URLに検索ワードが含まれていません");
}

jQuery

const url = "https://example.com/search?q=javascript";
const searchTerm = "javascript";

if ($("a").attr("href").indexOf(searchTerm) !== -1) {
  console.log("URLに検索ワードが含まれています");
} else {
  console.log("URLに検索ワードが含まれていません");
}

補足

上記の例では、indexOf(), includes(), match() メソッドを使用して、URLに特定の文字列が含まれているかどうかをチェックしています。
jQueryを使用する場合は、attr("href") メソッドを使用してURLを取得し、indexOf() メソッドを使用して検索ワードが含まれているかどうかをチェックしています。
これらの方法は、URLの任意の部分に文字列が含まれているかどうかをチェックするために使用できます。
特定のパラメータ値に文字列が含まれているかどうかを確認したい場合は、URLSearchParams オブジェクトを使用できます。

HTML

<a href="https://example.com/search?q=javascript">Example</a>

JavaScript

const url = "https://example.com/search?q=javascript";
const searchTerm = "javascript";

// indexOf() メソッドを使用する例
if (url.indexOf(searchTerm) !== -1) {
  console.log("URLに検索ワードが含まれています");
} else {
  console.log("URLに検索ワードが含まれていません");
}

// includes() メソッドを使用する例
if (url.includes(searchTerm)) {
  console.log("URLに検索ワードが含まれています");
} else {
  console.log("URLに検索ワードが含まれていません");
}

// match() メソッドを使用する例
const result = url.match(searchTerm);

if (result) {
  console.log("URLに検索ワードが含まれています");
} else {
  console.log("URLに検索ワードが含まれていません");
}

// jQueryを使用する例
if ($("a").attr("href").indexOf(searchTerm) !== -1) {
  console.log("URLに検索ワードが含まれています");
} else {
  console.log("URLに検索ワードが含まれていません");
}

実行結果

URLに検索ワードが含まれています
URLに検索ワードが含まれています
URLに検索ワードが含まれています
URLに検索ワードが含まれています

URLに特定の文字列が含まれているかどうかを確認する他の方法

正規表現を使用して、URLに特定のパターンが含まれているかどうかをチェックできます。

const url = "https://example.com/search?q=javascript";
const searchTerm = "javascript";

const regex = new RegExp(searchTerm);

if (regex.test(url)) {
  console.log("URLに検索ワードが含まれています");
} else {
  console.log("URLに検索ワードが含まれていません");
}

URLSearchParams

const url = new URL("https://example.com/search?q=javascript");
const searchParams = new URLSearchParams(url.search);

if (searchParams.has("q") && searchParams.get("q").includes(searchTerm)) {
  console.log("URLに検索ワードが含まれています");
} else {
  console.log("URLに検索ワードが含まれていません");
}