在本文中，我們將介紹如何使用JQuery來實(shí)現(xiàn)隱藏和顯示效果。 創(chuàng)建項(xiàng)目 首先，打開HBuilderX軟件，并點(diǎn)擊菜單欄的文件 -gt; 新建 -gt; 項(xiàng)目。輸入項(xiàng)目名并選擇創(chuàng)建基本HTML項(xiàng)目

在本文中，我們將介紹如何使用JQuery來實(shí)現(xiàn)隱藏和顯示效果。

創(chuàng)建項(xiàng)目

首先，打開HBuilderX軟件，并點(diǎn)擊菜單欄的文件 -gt; 新建 -gt; 項(xiàng)目。輸入項(xiàng)目名并選擇創(chuàng)建基本HTML項(xiàng)目，然后點(diǎn)擊創(chuàng)建按鈕。

編寫代碼

在HTML文件中，鍵入以下完整的代碼：

lt;!DOCTYPE htmlgt;
lt;htmlgt;
    lt;headgt;
        lt;meta charset"utf-8"gt;
        lt;titlegt;JQuery如何實(shí)現(xiàn)隱藏和顯示效果？lt;/titlegt;
        lt;script src"js/jquery-3.3.1.js"gt;lt;/scriptgt;
        lt;scriptgt;
            $(document).ready(function(){
                $(".hide").click(function(){
                    $("p").hide();
                });
                $(".show").click(function(){
                    $("p").show();
                });
            });
        lt;/scriptgt;
    lt;/headgt;
    lt;bodygt;
        lt;input type"text" id"text"gt;lt;brgt;
        lt;pgt;如果你點(diǎn)擊“隱藏”按鈕，我將會(huì)消失。lt;/pgt;
        lt;button class"hide"gt;隱藏lt;/buttongt;
        lt;button class"show"gt;顯示lt;/buttongt;
    lt;/bodygt;
lt;/htmlgt;

運(yùn)行和查看效果

點(diǎn)擊運(yùn)行并在瀏覽器中打開項(xiàng)目，你將可以看到一個(gè)文本框和兩個(gè)按鈕。當(dāng)你點(diǎn)擊“隱藏”按鈕時(shí)，文本“如果你點(diǎn)擊“隱藏”按鈕，我將會(huì)消失?！睂?huì)被隱藏。再次點(diǎn)擊“顯示”按鈕，則文本將會(huì)重新顯示。