我试图通过以下方式获取具有特定类的第一个元素,该类遵循使用纯 JS(无 JQuery)单击的元素,但 get el.nextSibling 不是函数错误。最初我使用的是 JQueryparents().next() 但想用纯 JS 来做到这一点:
const togglers = document.querySelectorAll('.toggler');
//console.log(togglers);
togglers.forEach(function(el) {
el.addEventListener('click', function(e) {
//const content = el.innerHTML;
//console.log(content);
el.nextSibling('.folder-content').style.display = 'block';
})
});
<div class="folder">
<div class="toggler">Click me 1</div>
<div class="folder-content" style="display: none">
Lorem ipsum
</div>
</div>
<div class="folder">
<div class="toggler">Click me 2</div>
<div class="folder-content" style="display: none">
Lorem ipsum
</div>
</div>
任何帮助,将不胜感激 :)
nextElement
是一个属性,而不是一个函数,所以你不要使用()
用它。也就是说,使用nextSibling
可以为您提供您不想要的空白内容。相反,你可以使用nextElementSibling:
el.nextElementSibling.style.display = 'block';
const togglers = document.querySelectorAll('.toggler');
//console.log(togglers);
togglers.forEach(function(el) {
el.addEventListener('click', function(e) {
//const content = el.innerHTML;
//console.log(content);
el.nextElementSibling.style.display = 'block';
})
});
<div class="folder">
<div class="toggler">Click me 1</div>
<div class="folder-content" style="display: none">
Lorem ipsum
</div>
</div>
<div class="folder">
<div class="toggler">Click me 2</div>
<div class="folder-content" style="display: none">
Lorem ipsum
</div>
</div>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)