JS隱藏顯示圖片


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>  
</head>
<body>
    <button id="btn">隱藏</button>
    <br>
    <img src="img/1.jpeg" id="new">
    <script>
        var obtn=document.getElementById('btn');
        var img=document.getElementsByTagName('img')[0];
        //獲取出img集合中的索引為0的照片
        obtn.onclick=function(){
            if(obtn.innerHTML=='隱藏')
            {
            img.style.display='none';
            obtn.innerHTML="顯示";
            如果相等則改變obtn的文字為顯示
            }
            else
            {
                img.style.display='block';
                obtn.innerHTML="隱藏";
            如果不相等則改變obtn的文字為隱藏
            }

        }

    </script>
</body>
</html>


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM