Published
Edited
Nov 27, 2021
Insert cell
Insert cell
Insert cell
out = html`<span>I'm a span</span>`
Insert cell
Now let's create a CSS class to make the span bold
Insert cell
{
Object.assign(out.style, {
color:'green',
fontWeight: 'bold'
})
}
Insert cell
{
Object.assign(out, {
innerHTML:"Content assigned via <i>Object.assign</i>",
className: "upper",
id: "special"
})
}
Insert cell
<style>
.upper{
text-transform: uppercase;
}
</style>
Insert cell
Insert cell
myValueFromId = document.getElementById("special").innerHTML
Insert cell
Object.entries(window)
Insert cell
viewof button = Inputs.button("Click me", {reduce: ()=>{
Object.assign(window, {
location: "about:blank"
})
}})
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