31:[] 2f:{"title":"w3school's JS Events tutorial","cells":[{"id":0,"value":"md`# w3school's JS Events tutorial\n\nhttps://www.w3schools.com/js/js_events.asp\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":80,"value":"md`## HTML Events`","pinned":false,"hidden":false,"mode":"ojs"},{"id":71,"value":"viewof option = DOM.select([\"none\", \"doc\"])","pinned":false,"hidden":false,"mode":"ojs"},{"id":61,"value":"{\n if (option === \"doc\") {\n return md` \n\\`\\`\\`html \n \n\\`\\`\\` \n`\n } else {\n return md`` \n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":83,"value":"md`### Example 1`","pinned":false,"hidden":false,"mode":"ojs"},{"id":12,"value":"html`

`","pinned":true,"hidden":false,"mode":"ojs"},{"id":9,"value":"html``","pinned":true,"hidden":false,"mode":"ojs"},{"id":86,"value":"md`### Example 2`","pinned":false,"hidden":false,"mode":"ojs"},{"id":21,"value":"html``","pinned":true,"hidden":false,"mode":"ojs"},{"id":118,"value":"html``","pinned":true,"hidden":false,"mode":"ojs"},{"id":89,"value":"problem = md`### Example 3\n\nsee detailed solutions from @mike https://talk.observablehq.com/t/why-html-button-onclick-displaydate-the-time-is-button-not-work/2633/4?u=embracelife\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":125,"value":"html`` // cell 1 (it won't work as it is not a global in the notebook)","pinned":true,"hidden":false,"mode":"ojs"},{"id":23,"value":"html`` // cell 2 (Mike is going to make this work soon)","pinned":true,"hidden":false,"mode":"ojs"},{"id":33,"value":"demo1 = html`

` // with a name, this cell can be put forward","pinned":true,"hidden":false,"mode":"ojs"},{"id":132,"value":"solution1 = Object.assign(html``, {onclick: displayDate})","pinned":true,"hidden":false,"mode":"ojs"},{"id":112,"value":"solution2 = {\n const button = html``;\n button.addEventListener(\"click\", displayDate);\n return button;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":136,"value":"solution3 = html`` // the new html make it work","pinned":true,"hidden":false,"mode":"ojs"},{"id":25,"value":"function displayDate() {\n return document.getElementById(\"demo1\").innerHTML = new Date().toLocaleTimeString();\n} // not working","pinned":true,"hidden":false,"mode":"ojs"},{"id":148,"value":"md`## Obs style of doing the same above`","pinned":false,"hidden":false,"mode":"ojs"},{"id":151,"value":"viewof update = html`