时间戳

首页 > 解决方案 > 处理 document.getElementById 抛出 nullreference 错误的更好方法是什么

javascript - 处理 document.getElementById 抛出 nullreference 错误的更好方法是什么

问题描述

我尝试从 html 中获取一些可能存在或不存在的元素。现在，如果我尝试

//previous code
document.getElementById("MyElement1").checked = false;
document.getElementById("MyElement2").checked = false;
...
//rest of the code

那么如果其中一个元素不存在，则其余代码将不会被执行。

我会做

try {
   document.getElementById("MyElement1").checked = false;
   document.getElementById("MyElement2").checked = false;
   ...
} catch (e) {
   console.log(e);
}

但据说你永远不应该使用 try...catch 来处理非严重错误。

如果其中一个元素不存在，是否有更优雅的方式使 javascript 忽略这行代码？

PS：如果这些元素之一不存在，则以下元素也不存在。因此，如果MyElement1存在，但MyElement2不存在， thenMyElement3等MyElement4也不存在。

此外，我尽量避免使用大块代码，例如对这些元素中的每一个使用 if

标签： javascript

解决方案

如果我是你，我会做以下事情：

  1. 为所有元素添加一个通用类名（比如 myElement）。
  2. 使用 document.getElementsByClassName 一次性检索所有元素。
  3. 迭代它们以设置返回元素的检查值

解决方案类似于以下：

//previous code
const els = document.getElementByClassName("myElement");
Array.from(els).forEach((el) => { el.checked = false; });
...
//rest of the code

推荐阅读