这回死

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>显示和隐藏</title>
        <script type="text/javascript">
            function showPicture(){
                //普通方式获得控件实例
                var e = document.getElementById("myimg");
                e.style.display = "block";
            }
            
            function hidePicture(){
                //querySelector是html5增加的
                //id前面得写#,class前面得写
                document.querySelector("#myimg").style.display = "none";
                //标签直接写即可,获取到第一个img标签
                //document.querySelector("img").style.display = "none";
            }
        </script>
    </head>
    <body>
        <a href="javascript:void(0);"onclick="showPicture()">查看图片</a>
        <a href="javascript:void(0);"onclick="hidePicture()">隐藏图片</a>
        <br />
        <img id="myimg" src="http://www.w3school.com.cn/i/eg_mouse.jpg" style="display: none;"  >
    </body>
</html>
posted @ 2019-06-29 10:35  若汐兮  阅读(43)  评论(0)    收藏  举报