Javascript .checked=true或不附加setAttribute（“checked”和“checked”）

我需要使用CSS“checkbox hack”来实现滑动菜单指示器效果，我唯一的方法是通过JavaScript附加输入元素。我被迫通过在线工具MonoSolutions来实现这一点，我受到很多元素和属性的限制，这些元素和属性是在我的控制之外自动设置的，否则我会手动将其添加到DOM中。无论如何：

这就是我所拥有的：

window.onload = function AddCheckbox() {
  var listitem = document.getElementsByTagName("li");
  for(i = 0; i < listitem.length; i++) {
    var checkbox = document.createElement("input");
    checkbox.type = "radio";
    checkbox.name = "slide-item";
    checkbox.className = "slide-toggle";
    checkbox.id = "menu-item-" + [i+1];
    if(listitem[i].className == " active")
    {
      checkbox.checked = true;
    }
    document.getElementsByTagName("li")[i].appendChild(checkbox);
  }
}

window.onload=函数AddCheckbox（）{
var listitem=document.getElementsByTagName（“li”）；
对于（i=0；i

除了if语句将复选框默认状态设置为checked

checked

之外，这个函数中的所有内容都工作得很好，我不明白为什么这个部分没有附加到“active”li元素下的复选框中

我尝试了可选的

checkbox.setAttribute（“checked”、“checked”）var-activeClass=document.querySelector（“li”）尝试了另一种方法

并将其与if（activeClass[i].classList.contains（“active”）一起使用，但不使用任何内容

由于编辑器添加了

aria current=“page”

，我想我也可以尝试

if（listitem[I].aria current==“page”）

请注意，我无法控制li类名的设置方式。在线工具在非活动菜单项上设置

（根本没有类名，只是一个空属性），并为活动菜单项设置

。出于某些愚蠢的原因，它在（

class=“active”

）前面添加了一个空格。我不知道这是否会影响什么，但最后一个重要的细节是将活动li类下的复选框默认为checked，这一点对于我的任何方法都不起作用

我搜索过的所有稍微相似的帖子都不能真正回答我的问题。我错过了什么

if（listitem[i].className==“active”）

很容易中断（在

active

之前没有空格，之后有空格，之前或之后有任何其他类）。相反，请考虑：

if (listitem[i].classList.contains("active"))

classList.contains

查看元素是否具有给定的类，而不管它可能具有任何其他类，或者在类名之前或之后是否有空格

---

另外，请注意，由于您的

输入

是

type=“radio”

并且有一个

名称

，因此只有最后一个进行

checked=true

的输入将保留它，因为一个通用的

名称

将它们放在一个组中，并且在任何给定时间只能检查一个单选按钮

---

（通常我们称之为“单选按钮”，而不是“复选框”；复选框是

type=“checkbox”

）

这几乎肯定不是问题所在，但代码受制于我所说的：您需要声明

I

。通过不声明它，赋值给它会自动创建一个全局变量。我怎么没有想到这一点。我们也在考虑同样的事情（划分类），但我似乎把if语句与querySelector变量一起使用，使它变得不必要的复杂。那确实管用！谢谢！