zoukankan      html  css  js  c++  java
  • 图片的隐藏与显示

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head>
        <title>练习5-2</title>
    </head>
    <body>
        <!--设置3个图片-->
        <img src="icon1.png" style="visibility:visible;"/>
        <img src="icon2.png" style="visibility:visible;"/>
        <img src="icon3.png" style="visibility:visible;"/><br />
        <!--设置两个按钮,一个发送“显示”命令,一个发送“屏蔽”命令-->
        <input id="Button1" type="button" value="屏蔽" onclick="return Button1_onclick('hidden')" />
        <input id="Button2" type="button" value="显示" onclick="return Button1_onclick('visible')" />
    <script language="javascript">
    function Button1_onclick( arg )// 按钮的单击事件处理程序
    {
        try
        {
            var imgs = document.images; // 取得网页中的所有图片
            
            for( n in imgs )            // 遍历图片数组
            {
                if( imgs[n] == imgs.length )    // 忽略第一个元素,因为其不是图片对象
                {
                    continue;
                }
                imgs[n].style.visibility= arg;  // 使用传入的参数设置图片可视状态,有visible和hidden
            }
        }
        catch( e )                              
        {
             alert(e.description);              // 出错时输出出错信息
        }
    }
    </script>
    </body>
    </html>
  • 相关阅读:
    链接被点击时不出现虚线框的方法
    label 和 legend标签的用法
    了解常见的浏览器内核 Trident,Geckos,Presto,Webkit
    DOCTYPE声明的几种类型
    Angularjs基础教程
    理解angular中的module和injector,即依赖注入
    es5 api
    css3_note
    canvas 基础知识
    uglifyjs note
  • 原文地址:https://www.cnblogs.com/huodaihao/p/7354637.html
Copyright © 2011-2022 走看看