Javascript 在下面的场景中，为什么我不能访问div中包含的内部div和input元素？

我有一个非常长的网页HTML。作为你的参考，我在下面放了一个有代表性的HTML。像这个HTML，所有其他HTML都在我的网页上

<tr class="bulkop">
  <td valign="middle">
    <p class="custom-form">
      <div class="ez-checkbox">
        <input id="practice_6_189" class="custom-check ez-hide" type="checkbox" onchange="enable_text_boxes('practice_6_189')" value="189" name="practice_topics_6[]">
      </div>
      <label>Enviornmetal Chemistry</label>
      <input type="hidden" value="Enviornmetal Chemistry" name="topic_names[189]">
    </p>
  </td>
  <td valign="middle">
    <em>Total 150</em>
    <input id="practice_6_189_1" class="mini" type="text" disabled="" value="" maxlength="3" name="practice_6_189_1">
    <input type="hidden" value="150" name="practice_available_questions_6_189_1">
  </td>
  <td valign="middle">
    <em>Total 81</em>
    <input id="practice_6_189_2" class="mini" type="text" disabled="" value="" maxlength="3" name="practice_6_189_2">
    <input type="hidden" value="81" name="practice_available_questions_6_189_2">
  </td>
  <td valign="middle">
    <em>Total 122</em>
    <input id="practice_6_189_3" class="mini" type="text" disabled="" value="" maxlength="3" name="practice_6_189_3">
    <input type="hidden" value="122" name="practice_available_questions_6_189_3">
  </td>
</tr>
<tr class="bulkop">
  <td valign="middle">
    <p class="custom-form">
      <div class="ez-checkbox">
        <input id="practice_6_190" class="custom-check ez-hide" type="checkbox" onchange="enable_text_boxes('practice_6_190')" value="190" name="practice_topics_6[]">
      </div>
      <label>Structure of Atom</label>
      <input type="hidden" value="Structure of Atom" name="topic_names[190]">
    </p>
  </td>
  <td valign="middle">
    <em>Total 810</em>
    <input id="practice_6_190_1" class="mini" type="text" disabled="" value="" maxlength="3" name="practice_6_190_1">
    <input type="hidden" value="810" name="practice_available_questions_6_190_1">
  </td>
  <td valign="middle">
    <em>Total 394</em>
    <input id="practice_6_190_2" class="mini" type="text" disabled="" value="" maxlength="3" name="practice_6_190_2">
    <input type="hidden" value="394" name="practice_available_questions_6_190_2">
  </td>
  <td valign="middle">
    <em>Total 321</em>
    <input id="practice_6_190_3" class="mini" type="text" disabled="" value="" maxlength="3" name="practice_6_190_3">
    <input type="hidden" value="321" name="practice_available_questions_6_190_3">
  </td>
</tr>

环境金属化学

总数150
总数81
总数122

原子结构

总数810
总数394
总数321

我刚刚添加了两个

标签供您参考。实际上，我的HTML有很多这样的

。现在，我想访问一个页面中所有

标记的内部div和div中包含的输入。为此，我编写了以下jQuery，但无法将所述类应用于div以及div中的输入。我在控制台中没有收到任何错误。如果我在操作HTML元素时出错了，你能纠正我吗？提前谢谢。我的jQuery函数代码如下：

$（文档）.ready（函数（）{
$（“#ckbCheckAll”）。单击（函数（）{
$（'tr.bulkop td p div.ez checkbox'）.toggleClass（“ez checked”，this.checked）；
$（'tr.bulkop td p div.ez checkbox input'）.toggleClass（“ez checked”，this.checked）；
var id_复选框=$（'tr.bulkop td p div.ez checkbox input'）.map（函数（）{
返回此.id；
}).get（）；
对于（变量i=0；i

---

我无法切换这些类。请帮助我解决此问题。

正确的选择器不是“tr

.bulkop td p div

.ez checkbox”，而是“tr.bulkop td p div.ez-checkbox”。这是因为指定选择器和子选择器之间存在差异：删除标记名和类之间的空格将使选择器查找具有此标记名和类的元素。

因为在

中不能有
它是无效的标记。。。。看
 你有不同的html。@FLCL当然html是不同的。。。如果您试图将
标记嵌套在
标记内。。浏览器将自动关闭
标记。。看看这个。。。
$(document).ready(function()  { 
$("#ckbCheckAll").click(function () {   

    $('tr .bulkop td p div .ez-checkbox').toggleClass("ez-checked", this.checked);
    $('tr .bulkop td p div .ez-checkbox input').toggleClass("ez-checked", this.checked);

    var id_checkboxes = $('tr .bulkop td p div .ez-checkbox input').map(function() {
      return this.id;
    }).get();
    for (var i = 0; i < id_checkboxes.length; i++) {
      toggle_question_count('#'+id_checkboxes[i]);
    }    
  });
});