如何用JavaScript获取并删除复选框关联的Label元素？

你可以利用label的for属性和复选框id的关联关系定位对应label元素，同时别忘了删除跟着的换行符<br>。修改事件监听代码即可：

Check.addEventListener('change', event => {
    const checkbox = event.target;
    // 通过for属性匹配复选框id，找到对应的label
    const label = document.querySelector(`label[for="${checkbox.id}"]`);
    // 获取label后面的换行符br
    const br = label.nextElementSibling;
    
    // 直接删除三个元素（现代浏览器支持直接调用remove()）
    checkbox.remove();
    label.remove();
    br.remove();
});

更健壮的写法 #

如果担心后续元素结构变动，建议把复选框、label、br放在同一个容器里，删除时直接删掉整个容器，这样更省心：

// 创建时新增容器
const container = document.createElement('div');

container.appendChild(Check);
container.appendChild(Label);
container.appendChild(LineBreak);

document.getElementById("MyList").appendChild(container);

// 事件监听里直接删除容器
Check.addEventListener('change', event => {
    event.target.parentElement.remove();
});

内容的提问来源于stack exchange，提问作者ACCE