regular expression split() substr() https://stackoverflow.com/questions/18558417/get-first-word-of-string/18558427
Disable a link
Scenario: disable button for next step in checkout when number of articles in cart exceeding limitation, the button for paypal is actually a link element.
transition-timing-function
Ease (default): accelerate sharply – decelerate linear: no speed change ease-in: accelerate smoothly ease-out: decelerate smoothly ease-in-out: accelerate smoothly – decelerate smoothly steps( n, <jumpterm>): Staircase functions enable animation to jump between the specific number of frames in a non-continuous way. Easing Function cubic-bezier Value Starting Speed Middle Speed Ending Speed linear cubic-bezier(0.0, 0.0, 1.0, 1.0) […]
Vue.js Directives
click-outside https://stackoverflow.com/a/42389266 Bonus: add tabindex attribute to enable element to be focused https://stackoverflow.com/a/53956904
Prevent parent scrolling
overscroll-behavior auto – Default. Scrolls that originate on the element may propagate to ancestor elements. contain – prevents scroll chaining. Scrolls do not propagate to ancestors but local effects within the node are shown. For example, the overscroll glow effect on Android or the rubberbanding effect on iOS which notifies the user when they’ve hit a […]
Node Selectors
HTMLCollection The HTMLCollection interface represents a generic collection (array-like object similar to arguments) of elements in document order and offers methods and properties for selecting from the list. An HTMLCollection is live (getElement* calls return collections of references), it is automatically updated when the underlying document is changed. https://developer.mozilla.org/en-US/docs/Web/API/HTMLCollection HTMLCollections are not as array-like as […]
Measure function execution time
Background: Need to call a button click function in the child component from parent. Two methods: Call method in the child component Trigger click event on the button of the child element Want to compare performance of these two methods. https://stackoverflow.com/questions/313893/how-to-measure-time-taken-by-a-function-to-execute
Array
Remove duplicate values https://stackoverflow.com/a/9229821 Get the last item https://stackoverflow.com/questions/3216013/get-the-last-item-in-an-array https://stackoverflow.com/questions/9050345/selecting-last-element-in-javascript-array Toggle an element PS: only removes the first instance of the value https://stackoverflow.com/questions/17153238/how-to-toggle-an-element-in-array-using-javascript Check existence of an element tests whether at least one element in the array passes the test implemented by the provided function Scenario: To check if an element contains at least one of […]
Element class
Element.classList https://developer.mozilla.org/en-US/docs/Web/API/Element/classList Class start with selector [class^=”pre-“] Only check the first item in classList
Data attribute
Set attribute Get attribute Delete attribute