The avatar for @triptych
Andrew Wooldridge
📜JavaScript developer. 🐲RPG fan. 📚Storyteller and 🕹game developer. 👨Father and Husband.
Published
Tips and Utilities
Edited
Jun 5, 2022
1 fork
7 stars
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
myList = md`
* eggs
* bacon
* toast
* milk
* cereal

`
Insert cell
Insert cell
Insert cell
myListNodeList = myList.querySelectorAll("li")
Insert cell
Insert cell
myListArray = Array.from(myListNodeList)
Insert cell
Insert cell
myListData = myListArray.map((itm,idx,arr)=>itm.innerHTML)
Insert cell
Insert cell
Insert cell
myListJSON = JSON.stringify(myListData)
Insert cell
Insert cell
Insert cell
out = {
let blob = new Blob([myListJSON], {type: 'application/json'});
const downloadLink = `
<strong>Click this link to <a href="${URL.createObjectURL(blob)}" download="myList.json">download</a> the file.</strong>
`
const out = html`<div class="download">${downloadLink}</div>`;
yield out; // auto updates the HTML when any referenced variable changes, like myListJSON.
}
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more