diff --git a/README.md b/README.md index 79ba0b7b9..4cf22061e 100644 --- a/README.md +++ b/README.md @@ -2014,7 +2014,7 @@ const hide = (...el) => [...el].forEach(e => (e.style.display = 'none')); Examples ```js -hide(document.querySelectorAll('img')); // Hides all elements on the page +hide(...document.querySelectorAll('img')); // Hides all elements on the page ``` @@ -2288,7 +2288,7 @@ const show = (...el) => [...el].forEach(e => (e.style.display = '')); Examples ```js -show(document.querySelectorAll('img')); // Shows all elements on the page +show(...document.querySelectorAll('img')); // Shows all elements on the page ``` diff --git a/docs/index.html b/docs/index.html index 5eb613a54..c4236677e 100644 --- a/docs/index.html +++ b/docs/index.html @@ -375,7 +375,7 @@ console.log<

hasClass

Returns true if the element has the specified class, false otherwise.

Use element.classList.contains() to check if the element has the specified class.

const hasClass = (el, className) => el.classList.contains(className);
 
hasClass(document.querySelector('p.special'), 'special'); // true
 

hide

Hides all the elements specified.

Use the spread operator (...) and Array.forEach() to apply display: none to each element specified.

const hide = (...el) => [...el].forEach(e => (e.style.display = 'none'));
-
hide(document.querySelectorAll('img')); // Hides all <img> elements on the page
+
hide(...document.querySelectorAll('img')); // Hides all <img> elements on the page
 

httpsRedirect

Redirects the page to HTTPS if its currently in HTTP. Also, pressing the back button doesn't take it back to the HTTP page as its replaced in the history.

Use location.protocol to get the protocol currently being used. If it's not HTTPS, use location.replace() to replace the existing page with the HTTPS version of the page. Use location.href to get the full address, split it with String.split() and remove the protocol part of the URL.

const httpsRedirect = () => {
   if (location.protocol !== 'https:') location.replace('https://' + location.href.split('//')[1]);
 };
@@ -460,7 +460,7 @@ document.bodyclipboard Copy to clipboard

setStyle

Sets the value of a CSS rule for the specified element.

Use element.style to set the value of the CSS rule for the specified element to val.

const setStyle = (el, ruleName, val) => (el.style[ruleName] = val);
 
setStyle(document.querySelector('p'), 'font-size', '20px'); // The first <p> element on the page will have a font-size of 20px
 

show

Shows all the elements specified.

Use the spread operator (...) and Array.forEach() to clear the display property for each element specified.

const show = (...el) => [...el].forEach(e => (e.style.display = ''));
-
show(document.querySelectorAll('img')); // Shows all <img> elements on the page
+
show(...document.querySelectorAll('img')); // Shows all <img> elements on the page
 

toggleClass

Toggle a class for an element.

Use element.classList.toggle() to toggle the specified class for the element.

const toggleClass = (el, className) => el.classList.toggle(className);
 
toggleClass(document.querySelector('p.special'), 'special'); // The paragraph will not have the 'special' class anymore
 

UUIDGeneratorBrowser

Generates a UUID in a browser.

Use crypto API to generate a UUID, compliant with RFC4122 version 4.

const UUIDGeneratorBrowser = () =>