Liquidsのロゴ Liquids

0

JavaScriptでURLを分解する

JavaScript

JavaScriptにはURLオブジェクトというものがあり、これを利用することで簡単にURLの各部分を取得することができます。

この方法であれば正規表現を使う必要もないので、手軽にURLから必要な情報を抜き出すことができます。

const url_text1 = 'https://example.com/search?q=js&page=1&order=update-desc';
const url1 = new URL(url_text1);

console.log(url1.host)
// example.com
console.log(url1.hostname)
// example.com
console.log(url1.origin)
// https://example.com
console.log(url1.pathname)
// /search
console.log(url1.protocol)
// https:
console.log(url1.search)
// ?q=js&page=1&order=update-desc
console.log(url1.searchParams)
// URLSearchParams { 'q' => 'js', 'page' => '1', 'order' => 'update-desc' }

const url_text2 = 'https://example.com/articles/test-article#testhash';
const url2 = new URL(url_text2);

console.log(url2.hash)
// #testhash

const url_text3 = 'http://localhost:3000/';
const url3 = new URL(url_text3);

console.log(url3.port)
// 3000

目次

Liquidsのロゴ Liquids

Liquidsは誰でも投稿・編集ができる技術Wikiコミュニティ📝です。

あなたもLiquidsで技術Wikiを
書いてみませんか?