Deriving a new Array from an existing Array:
['■','●','▲'].slice(1, 3) ⟼ ['●','▲']
['■','●','■'].filter(x => x==='■') ⟼ ['■','■']
['▲','●'].map(x => x+x) ⟼ ['▲▲','●●']
['▲','●'].flatMap(x => [x,x]) ⟼ ['▲','▲','●','●']
const getAllFocusableElements = (parent) => Array.from(parent.querySelectorAll('*')).filter(elm => elm.tabIndex > -1).sort((a,b) => a.tabIndex > b.tabIndex ? 1 : a.tabIndex < b.tabIndex ? -1 : 0); |
<!DOCTYPE html> | |
<html> | |
<head> | |
<title>Accordions</title> | |
<style type="text/css"> | |
body { | |
margin: 0 auto; | |
max-width: 40em; | |
width: 88%; |
// Licensed under a CC0 1.0 Universal (CC0 1.0) Public Domain Dedication | |
// http://creativecommons.org/publicdomain/zero/1.0/ | |
(function (win, doc) { | |
// Cut the mustard. | |
if (!win.localStorage) return; | |
// You should probably use a more specific selector than this. | |
var textarea = doc.querySelector('textarea'); | |
// The key for the key/value pair in localStorage is the current URL. | |
var key = win.location.href; |
// Licensed under a CC0 1.0 Universal (CC0 1.0) Public Domain Dedication | |
// http://creativecommons.org/publicdomain/zero/1.0/ | |
/* | |
This function takes two arguments: | |
element: a reference to a DOM node in the document e.g. a button. | |
feedbackContent: a string of text or HTML. | |
An example of usage would be: | |
document.querySelector('button').addEventListener('click', function() { |
const { execSync } = require('child_process') | |
const { createHash } = require('crypto') | |
const invertColor = require('invert-color') | |
const branchName = execSync('git rev-parse --abbrev-ref HEAD') | |
const hash = createHash('sha256') | |
hash.update(branchName) | |
const color = '#' + hash.digest().toString('hex').substring(0, 6) | |
const invertedColor = invertColor(color, true) |
const handleClick = e => { | |
if (!modalEl.contains(e.target)) modalEl.hidden = true; | |
}; |
javascript:(d=>{var css=`:root{background-color:#fefefe;filter:invert(100%)}*{background-color:inherit}img:not([src*=".svg"]),video{filter: invert(100%)}`,style,id="dark-theme-snippet",ee=d.getElementById(id);if(null!=ee)ee.parentNode.removeChild(ee);else {style = d.createElement('style');style.type="text/css";style.id=id;if(style.styleSheet)style.styleSheet.cssText=css;else style.appendChild(d.createTextNode(css));(d.head||d.querySelector('head')).appendChild(style)}})(document) |
// UPDATE: In 2023, you should probably stop using this! The narrow version of Safari that | |
// does not support `nomodule` is probably not being used anywhere. The code below is left | |
// for posterity. | |
/** | |
* Safari 10.1 supports modules, but does not support the `nomodule` attribute - it will | |
* load <script nomodule> anyway. This snippet solve this problem, but only for script | |
* tags that load external code, e.g.: <script nomodule src="nomodule.js"></script> | |
* | |
* Again: this will **not** prevent inline script, e.g.: |