重庆技术吧 关注:32贴子:267
  • 0回复贴,共1

JS—循环切换内容

只看楼主收藏回复

<!DOCTYPE html>
  <html lang="en">
  <head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
  a {
  cursor: pointer;
  color: red;
  }
  p {
  display: none;
  }
  </style>
  </head>
  <body>
  <a>循环切换内容</a>
  <p>11111</p>
  <p>22222</p>
  <p>33333</p>
  <script>
  //可以换成切换图片等等
  flag = 0;
  pre = 0;
  function con(){
  var cons = document.getElementsByTagName("p");
  document.getElementsByTagName("p")[pre].style.display = "none";
  document.getElementsByTagName("p")[flag].style.display = "inline";
  console.log(flag);
  pre = flag;
  if(flag == cons.length - 1) {
  flag = 0;
  } else {
  ++flag;
  }
  }
  </script>
  </body>
  </html>
  //这里要注意是cons.length-1,因为索引值是从0开始的


1楼2017-10-31 10:55回复