[效果备忘] Cannot read properties of null 的可能解决方法

现有如下代码：

    const canvas1 = document.querySelector("#animation-container1");
    const ctx1 = canvas1.getContext("2d");

明明检查过了，确实有id为animation-container1的元素存在，却会报错Cannot read properties of null (reading 'getContext')，即试图在一个空值(null)上使用getContext方法。

困扰许久，后来觉得可能是在这段代码执行时，#animation-container1可能还未加载出来。

于是使用了如下代码：

window.onload = function () {
    const canvas1 = document.querySelector("#animation-container1");
    const ctx1 = canvas1.getContext("2d");
    ...

使用window.onload，让代码在DOM加载完之后再执行。果不其然，报错消失了。

因此，今后遇到同样的报错，应该考虑DOM还未加载的问题。