我知道对用户输入使用innerHTML是不安全的
当使用innerHTML与用户输入时出现的问题是文档可能被“坏”输入破坏。在最坏的情况下，攻击者可以操纵用户输入窃取他们的凭证或执行特权动作等的代码。
风险来自于不受约束的用户输入，而不是用户输入本身。如果我有一个文本输入，其内容被逐字复制到元素的innerHTML中，这通常会被认为是有风险的，或者至少是高度可疑的。如果内容在添加到页面之前经过高质量的HTML消毒程序，那么风险就会大大降低。
在这种情况下，您只是根据用户输入添加了一个已知的HTML有效负载。这不是一个危险的行为。对于它的价值，这个特定的片段对我来说看起来很安全，但我没有被认可为HTML清理库！
顺便说一句，innerHTML操作可以被认为有点“代码味道”-部分原因是HTML注入安全方面，部分原因是它往往使确保文档“格式良好”变得更加困难，潜在的性能影响......您可能会在文档中拥有<div>并使用CSS和适当的ARIA标记隐藏/显示它。

与直接将用户输入合并到innerHTML中的情况相比，使用带有单选按钮的innerHTML（其中唯一的用户输入被选中而不是未选中）相对更安全。然而，使用innerHTML时总是存在一定程度的风险，因为如果不小心使用，它可能会引入跨站脚本（XSS）漏洞。
在您的特定案例中，注入innerHTML的内容似乎是一个静态字符串（“somehtml”），由于没有插入用户输入，因此不会立即产生XSS风险。如果您将用户输入插入innerHTML，风险会更高，因为它可能允许攻击者注入恶意脚本。
也就是说，避免使用innerHTML并选择更安全的替代方案（如textContent）或DOM API提供的方法（如createElement、createTextNode和appendChild）来创建和操作DOM元素通常是一个很好的做法。
以下是如何使用DOM API重写代码的示例：

const topsButton = document.getElementById("tops");
topsButton.addEventListener("click", () => {
  const div = document.createElement("div");
  div.textContent = "somehtml";
  chart.innerHTML = ""; // Clear the contents of the chart element
  chart.appendChild(div);
});

这样，您就可以使用一种更安全的方法来操作DOM，从而降低XSS漏洞的风险。

简而言之，如果单选按钮被innerHTML选中/取消选中，这是一个安全的选择。但是，总是建议清理用户输入并防止动态HTML构造。