下面的例子应该能帮助你理解并给你一个方法来完成你想要的。

• • 说明**

您应该做的是给每个子类别一个ID，它可以用来迭代子类别，这样只有那些复选框可以被选中，而不是所有的。

• • 超文本标记语言**

<ul>
  <li>
    <input type="checkbox" id="test-main"> test
  </li>
  <ul id="test-sub-items">
    <li>
      <input type="checkbox"> test
    </li>
    <li>
      <input type="checkbox"> Something
    </li>
    <li>
      <input type="checkbox"> Another Thing</li>
  </ul>

  <li>
    <input type="checkbox"> Blah
  </li>
  <li>
    <input type="checkbox"> blah
  </li>
</ul>

• • 脚本语言**

var parent = document.getElementById('test-sub-items'),
  parentCheckbox = document.getElementById('test-main');

parentCheckbox.addEventListener('click', function () {
  for (var i = 0; i < parent.children.length; i++) {
    if (parentCheckbox.checked == true)
      parent.children[i].firstElementChild.checked = true;
    else
      parent.children[i].firstElementChild.checked = false;

  }
});

这只是一个示例，您可以尝试将其合并到代码中。

• • 更新**

看了你的评论后，我很快想出了这个函数，应该会有所帮助：

function areAllChecked() 
{
  for (var i = 0; i < parent.children.length; i++) {
    if (parentCheckbox.checked == false)
      return false;
  }
  return true;
}

检查实时示例中的控制台以获取更新版本。

• • 实时示例**

JSFiddle
JSFiddle (Update 1)

• • 阅读材料**

children
firstElementChild

因为我没有找到任何其他地方的方法，我尝试了@Script47的例子试错，并得到了它的工作：

var child = document.getElementById('test-sub-items'), parentCheckbox = document.getElementById('test-main');

    child.addEventListener('click', function() {
      for (var i = 0; i < child.children.length; i++) {
        if (child.children[i].firstElementChild.checked == true)
          parentCheckbox.checked = true;
        else
          parentCheckbox.checked = false;

      }
    });

<ul>
<li>
<input type="checkbox" id="test-main"> Essen
</li>
    <ul id="test-sub-items">
      <li><input type="checkbox"> Apfel</li>
      <li><input type="checkbox"> Birne </li>
      <li><input type="checkbox"> Cadmium</li>
    </ul>

<li><input type="checkbox">Bier</li>
<li><input type="checkbox">C hohes</li>
</ul>