JavaScript改变了双方的显示风格

JavaScript change display style in both sides

本文关键字：显示 风格 改变 JavaScript      更新时间：2023-09-26

我需要在两个div之间无限次地更改显示样式。第一次更改是正常的，但向后更改不起作用。此外，我不能使用link来确定div，因为我有几个相同的div。

<script type="text/javascript">
    function func(el){
      if (smth != true) {var smth = false;}
      if (smth == false) {
         el.firstElementChild.style.display = 'none';
      el.lastElementChild.style.display = 'block';
        smth = true;
      } else {
        el.firstElementChild.style.display = 'block';
      el.lastElementChild.style.display = 'none';
        smth = false;
      }
    }
</script>

<div onClick="func(this)">
  <div>1</div>
  <div style="display:none;">2</div>
</div>

在代码中，每次调用func（）时，smth都是未定义的，因为它不是全局变量。要解决此问题，只需将smth设置为全局。

<script type="text/javascript">
var smth = false;
function func(el){
  if (smth == false) {
     el.firstElementChild.style.display = 'none';
  el.lastElementChild.style.display = 'block';
    smth = true;
  } else {
    el.firstElementChild.style.display = 'block';
  el.lastElementChild.style.display = 'none';
    smth = false;
  }
}
</script>

<div onClick="func(this)">
  <div>1</div>
  <div style="display:none;">2</div>
</div>
相关文章：