点击按钮显示或隐藏图片

jquery的show/hide可以

或者jquery中的toggleClass()方法
<!DOCTYPE html>
<html lang="en">
  <head>
  <meta charset="UTF-8">
  <title>点击显示或隐藏图片</title>
  <style>
    .show{
      display: block;
    }
    .hidden{
      display: none;
    }
  </style>
</head>
<body>
  <button>change</button>
    <img class="show" src="https://static.cnblogs.com/images/adminlogo.gif" alt="博客园">
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
  <script>

  //jquery 中直接切换className

  // $('button').click(function(){
  //       $('img').toggleClass('hidden');
  // })

  //原生js
  var btn = document.getElementsByTagName('button')[0];
  var img = document.getElementsByTagName('img')[0];

  btn.onclick = function(){
    if(img.className == "show" ){
      img.className = "hiden";
    }else{
      img.className='show';
    }
  }
  </script>
</body>
</html>

原文地址:https://www.cnblogs.com/hill-foryou/p/7531128.html