javascript - 隐藏div vanilla javascript的动态方式

Question

是否有更动态的方式来隐藏/显示结构相同但没有标识符的 div？ 点击显示 我是一些东西

<div class="setup" onclick="show(1)">
Click to show
  <p class="hidden">
    I'm more stuff
  </p>
</div>


function show(elem) {   
  var p = document.getElementsByClassName("hidden");
  if (p[elem] != undefined) {
    if (p[elem].style.display == "none") {
        p[elem].style.display = "block";
    } else {
      p[elem].style.display = "none";
    }
  }
}

http://jsfiddle.net/ba7yfmz6/29/

Answer 1

使用这个:

<div class="setup" onclick="show(this)">

JavaScript:

function show(elem) {
    var paragraph = elem.querySelector(".hidden");
    if (paragraph.style.display == "none") {
        paragraph.style.display = "block";
    } else {
        paragraph.style.display = "none";
}

希望这对您有所帮助!