Javascript 如何在querySelectorAll正则表达式中指定数字

我和复选框树一起工作，我玩它们的可视状态。 下面是一个由3个复选框组成的简单树

<div id="d1">
    <input type="checkbox" id="c1"  onclick="gestion('1')" >
    <label>1</label>
</div>
<div id="d1.1" class="initialHide">
    <input type="checkbox" id="c1.1" onclick="gestion('1.1')">
    <label>1.1</label>
</div>
<div id="d1.1.1" class="initialHide">
    <input type="checkbox" id="c1.1.1" onclick="gestion('1.1.1')">
    <label>1.1.1</label>
</div>

这是我的问题：我只想选择当前复选框的div的children div。d1只有d1.1作为直系子女。 但是我在QuerySelector中使用的正则表达式将返回all children div

有没有办法修改我的正则表达式以只获取直接子级？ 伪代码以d开头，然后是id。然后是数字，然后是其他。

---

例：鉴于d1.1是儿童，d1.1.1不是儿童

如果所需元素始终位于传递给函数的id为

id的元素之后，则可以使用来选择并替换为：


函数getCheckbox（id）{
return document.querySelector（`id=“d${id}”]+[id^=“d${id}.”]`）；
}
document.onchange=（e）=>{
log（getCheckbox（e.target.id.substring（1））；
};
log（getCheckbox（'1'））；
log（getCheckbox（'1.1'））；
log（getCheckbox（'1.1.1'））
标签{
显示：块；
}
.作为控制台包装{
最大高度：67px！重要；
}

1.
1.1
1.1.1
您没有使用regex，这是一个css选择器。
d1.1
不是直接的子项“Child”是HTML和css中定义的含义。“直接子对象”没有子对象，复选框不能有子对象。你到底在找什么？很抱歉用了child这个词，这可能会让人困惑。当我选中复选框c1时，我想显示div d1.1。当我选中复选框c1.1时，我想显示div d1.1.1。当我取消选中复选框c1时，我想同时隐藏div d1.1和d1.1.1。等等。这是一个复选框树的逻辑
function gestion(id){
    var rechercheDiv='[id^="d'+id+'."]';
    var listDiv = document.querySelectorAll(rechercheDiv)