JavaScript の module / export を使うときは onclick でなく addEventListener を使う
JavaScript の module / export を使うとき、要素の onclick は指定しないほうがいいかもしれない。
テンプレートリテラルで表示するものを export する場合を考える。
import { f } from './some.js'
export function display () {
document.getElementById('a').innerHTML = `
<button onclick="f()">Push</button>`
}
このとき onclick の f は動かない。
Uncaught ReferenceError: f is not defined at HTMLButtonElement.onclick
とエラーが出る。問題を解決するには
document.getElementById('#a button').addEventListener('click', f)
とする。document.getElementById はグローバルのスコープで addEventListener も適切に動く。