Question

我无法访问jquery。我正在尝试实现手风琴，但内容元素不是在标题之后。它类似于以下内容：

<div class="header">...</div>
  <div>
    <div class="content">

所以我添加了一个函数来处理标题上的onclick事件，然后需要获取HTML源代码中具有内容类的下一个元素。我怎样才能做到这一点？

Answer 1

您可以使用clickSlector在单击的标题节点

上实现此目的

<div class="header">
  <div>
    <div class="content">


[].forEach.call(document.querySelectorAll('.header'), function(header) {
    header.addEventListener('click', function(e) {
        var content = this.querySelector('.content');
        // here, "this" is the header div, and "content" is the content div
        // do majick accordion things here
    });
});

Answer 2

如何使用递归函数和nextSibling [获取下一个元素（不是孩子）]

<div class="header" onclick="hasClass(this)">...</div>
  <div>
    <div class="content"></div>
  </div>
<script>
function hasClass(e){
    if(e.nextSibling.children === undefined || e.nextSibling.children.length == 0){
        hasClass(e.nextSibling); //go next till find class
    }
    else{
    if(e.nextSibling.children[0].className == "content"){
        console.log(e.nextSibling.innerHTML);  //get class content html
    }
    }
}
</script>

Answer 3

你可以通过

获得

var contentDiv= document.getElementsByClassName("content");

Answer 4

try this document.getElementById(header).getElementsByClassName('content');

使用类名称获取下一个元素而不使用jquery

4 个答案: