zoukankan html css js c++ java

js实现展开与收回

1.通过id控制单个层:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>html边框虚线演示</title>
<style>
  .tabledata{
   background: rgba(251, 251, 251, 0.93);
   margin: 0; /* 上右下左 */
   border:1px solid #F00;
   }
  .tabledataxuxian{
   background: rgba(251, 251, 251, 0.93);
   margin: 0; /* 上右下左 */
   border:1px dashed #F00;
   }
</style>
<script language="javascript">
  function show_div(){
   var obj_div=document.getElementById("starlist");
   obj_div.style.display=(obj_div.style.display=='none')?'block':'none';
  }
  function hide_div(){
   var obj_div=document.getElementById("starlist");
   obj_div.style.display=(obj_div.style.display=='none')?'block':'none';
  }
</script>
</head>
<body>
<a href="javascript:hide_div()" >字段详情说明</a>
<div id="starlist">
  div 内容
</div>

</body>
</html>

js 脚本：

    <script language="javascript">
        function show_div(){
            var obj_div=document.getElementById("starlist");
            obj_div.style.display=(obj_div.style.display=='none')?'block':'none';
        }
        function hide_div(){
            var obj_div=document.getElementById("starlist");
            obj_div.style.display=(obj_div.style.display=='none')?'block':'none';
        }    
    </script>

2.通过class控制多个层：

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8" /> 
    <title>html边框虚线演示</title> 
    <style> 
        .tabledata{
            background: rgba(251, 251, 251, 0.93);
            margin: 0;  /* 上 右 下 左 */
            border:1px solid #F00;
            }
        .tabledataxuxian{
            background: rgba(251, 251, 251, 0.93);
            margin: 0;  /* 上 右 下 左 */
            border:1px dashed #F00;
            }
    </style> 
    <script language="javascript">
        function show_div(){
        var obj_div_s=document.getElementsByClassName("starlist");
        for (var i=0,obj_div;obj_div=obj_div_s[i];i++){
                obj_div.style.display=(obj_div.style.display=='none')?'block':'none';
            }
        }
        function hide_div(){
        var obj_div_s=document.getElementsByClassName("starlist");
        for (var i=0,obj_div;obj_div=obj_div_s[i];i++){
                obj_div.style.display=(obj_div.style.display=='none')?'block':'none';
            }

        }
    </script>
</head> 
<body> 
    <a href="javascript:hide_div()" >字段详情说明</a>
    <div class="starlist">
        div 内容

    </div>
    <div class="starlist">
        div 内容
    </div>
    <div class="starlist">
        div 内容
    </div>
</body> 
</html>

js脚本：

    <script language="javascript">
        function show_div(){
        var obj_div_s=document.getElementsByClassName("starlist");
        for (var i=0,obj_div;obj_div=obj_div_s[i];i++){
                obj_div.style.display=(obj_div.style.display=='none')?'block':'none';
            }
        }
        function hide_div(){
        var obj_div_s=document.getElementsByClassName("starlist");
        for (var i=0,obj_div;obj_div=obj_div_s[i];i++){
                obj_div.style.display=(obj_div.style.display=='none')?'block':'none';
            }

        }
    </script>

查看全文

相关阅读:
剖析 GSM 加密机制以及位置更新的过程
 利用ASK/OOK 发射模块，实现信号重放
 使用RTL-SDR打开车门
 复现 360 Unicorn Team 黑科技之 HackNFC
如何搭建并使用便携式 4G/LTE 伪基站研究移动安全
 如何利用 LTE／4G 伪基站＋GSM 中间人攻击攻破所有短信验证
 黑客炼金术士 Seeker：可以攻破 4G 摸到你短信，还要为朝阳群众提供谍战工具
 如何使用HackRF做一个简单的IMSI捕获器
 招中高级web开发工程师
 ionic 动画和返回按钮

原文地址：https://www.cnblogs.com/jingzaixin/p/13385272.html