欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

JavaScript實(shí)現(xiàn)顯示和隱藏圖片

 更新時(shí)間：2021年04月29日 14:37:38   作者：知識進(jìn)腦的肖老千啊  
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)顯示和隱藏圖片，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下

JavaScript之顯示和隱藏圖片，供大家參考，具體內(nèi)容如下

點(diǎn)擊按鈕可以顯示和隱藏圖片（默認(rèn)顯示），附上代碼：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>顯示和隱藏圖片</title>
</head>
<body>
    <button id="btn">隱藏</button>
    <br>
    <img src="img/image01.jfif" id="newGirlFriend">
    <script type="text/javascript">
        // 1.獲取事件源
        var obtn = document.getElementById("btn");
        var newImg = document.getElementsByTagName("img")[0];
        // var isShow = true; //方法2

        // 2.綁定事件
        obtn.onclick = function (){
            // if (isShow) { //方法2
            if (obtn.innerHTML === '隱藏') {
                // 3.事件驅(qū)動程序
                newImg.style.display = 'none';
                obtn.innerHTML = "顯示";  //
                // isShow = false; //方法2
            }else {
                newImg.style.display = 'block';
                obtn.innerHTML = "隱藏";
                // isShow = true; //方法2
            }
        }

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

有兩種實(shí)現(xiàn)方法，實(shí)現(xiàn)情況如下：

這是默認(rèn)顯示界面，點(diǎn)擊隱藏后，會這樣：

簡單的顯示和隱藏圖片功能就實(shí)現(xiàn)啦！

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

相關(guān)文章

最新評論