查找上一个元素的动态子元素

由 发布于

这是我当前的html：

<div class="wrapper">
    <div class="label"></div>
    <div class="warning"></div> // Dynamic
</div>
<div class="input"></div>
.
.
. // repeated 3 more times

因此，在我的JS文件中，我遍历了输入，并为每个输入添加了一个侦听器，以在聚焦时从输入元素中删除类。但我也想检查上一个元素中是否存在“警告”元素，如果存在，请将其删除。

这是我能想到的最好的方法（它不起作用：D）：

const inputs = document.querySelectorAll('.input');

inputs.forEach(input => {
    input.addEventListener('focus', () => {
        input.classList.remove('input--invalid')
        input.previousElementSibling.removeChild(document.querySelector('.warning'));
    });
});

可能错过了明显的事情（除了完全弥补之外）！