Using Just createElement() Create a div HTML Element in JavaScript by calling the createElement() method on the document object. This method takes an argument which will be the HTML Element. In this case…div. const box = document.createElement(“div”); box.id = “box”; document.body.appendChild(box); Assign it to the constant called box. Set the id property of box to ‘box‘. Add it to the DOM hierarchy by calling appendChild() on the document.body object with an argument box. Let’s […]
Category: JavaScript
Print messages to the status bar
Print messages to the status bar Display recent or important information to your users in a way that will catch their eye. window.status = “Your message here”;
Page redirect with optional delay
Page redirect with optional delay A rather valuable little snippet to keep in your back pocket. setTimeout( “window.location.href = ‘http://website.com/'”, 5*1000 );
Smooth scroll to the top of the current page
Smooth scroll to the top of the current page const scrollToTop = () => { const c = document.documentElement.scrollTop || document.body.scrollTop; if (c > 0) { window.requestAnimationFrame(scrollToTop); window.scrollTo(0, c – c / 8); } }; scrollToTop();
DOM and Vanilla JS
Ariel Jakubowski DOM tree structure Using JavaScript to Manipulate the DOM Accessing DOM Elements The query selector finds the first element or node that matches a specified parameter. The most common ways a query selector is used are to access elements of a certain type, elements with a certain id, and elements with a certain […]
13 JavaScript One-Liners That’ll Make You Look Like a Pro
1. Get a random boolean (true/false) This function will return a boolean (true or false) using the Math.random() method. Math.random will create a random number between 0 and 1, after which we check if it is higher or lower than 0.5. That means it’s a 50%/50% chance to get either true or false. const randomBoolean = () => Math.random() […]
Format Commas in Numbers
This function assumes what is being submitted to it is a string, with a decimal point and two places after the decimal. To get your number into that format first, use this. Then this function will properly comma separate the number. For example, 2345643.00 will return 2,345,643.00 function CommaFormatted(amount) { var delimiter = “,”; // […]
keyCodes
Key Code backspace 8 tab 9 enter 13 shift 16 ctrl 17 alt 18 pause/break 19 caps lock 20 escape 27 page up 33 page down 34 end 35 home 36 left arrow 37 up arrow 38 right arrow 39 down arrow 40 insert 45 delete 46 0 48 1 49 2 50 3 51 […]