Manipulate Query Parameters Of URL In JavaScript – vanilla-js-url

Category: Javascript | April 16, 2021
Author: worka
Views Total: 16 views
Official Page: Go to website
Last Update: April 16, 2021
License: MIT

Preview:

Manipulate Query Parameters Of URL In JavaScript – vanilla-js-url

Description:

Just another URL manipulation JavaScript library that enables you to set and get (encoded/decoded) query parameters in URLs.

See Also:

How to use it:

1. Install & download.

# Yarn
$ yarn add vanilla-js-url

# NPM
$ npm i vanilla-js-url

2. Import the vanilla-js-url JavaScript library.

<script src="dist/url.min.js"></script>

3. Get query parameters from a URL you provide.

// basic
wurl.getParams('https://www.cssscript.com/example?css=1&script=2&com=3');
=> {"css":"1","script":"2","com":"3"}

// decode = false
wurl.getParams('https://www.cssscript.com/example?css=1&script=2&com=3', false);
=> {"css":"1","script":"2","com":"3"}

// extended
wurl.getParamsExtended('https://www.cssscript.com/example?css[t]=1&css[j]=2');
=> { css: { t: '1', j: '2' } }

4. Add query parameters to the URL.

// basic
wurl.add('https://www.cssscript.com/example', {"css":"1","script":"2","com":"3"});
=> https://www.cssscript.com/example?css=1&script=2&com=3

// encode = true
wurl.add('https://www.cssscript.com/example', {"css[c]":"1","css[s]":"1"}, true);
=> https://www.cssscript.com/example?css%5Bc%5D=1&css%5Bs%5D=1

5. Get the path from a URL.

wurl.path('https://www.cssscript.com/category/slider/index.html');
=> /category/slider/index.html

You Might Be Interested In:


Leave a Reply