Jquery——显示和隐藏

来源：互联网发布：通过网络被骗的案例编辑：程序博客网时间：2024/06/05 21:39

Jquery进行元素的显示和隐藏

<!DOCTYPE html><html><head><meta http-equiv="content-type" content="text/html;charset=utf-8"><!--官网的jquery库--><script  type="text/javascript"  src="http://code.jquery.com/jquery-2.1.4.min.js"></script><script type="text/javascript">    $(document).ready(function(){        $("#hide").click(function(){            $("p").hide();        });    $("#show").click(function(){        //暂时还不懂为什么只能用这个方式去修改        document.getElementById("p1").innerHTML = "我胡汉三回来了";            $("p").show();        });    });</script></head><body><p id="p1">我是个单纯的文本</p><button id="hide" type="button">隐藏</button><button id="show" type="button">显示</button></body></html>

效果演示：

初始打开
这里写图片描述

点击隐藏以后
这里写图片描述

点击显示以后
这里写图片描述

jquery调用方式修正

$("#show").click(function(){    //document.getElementById("p1").innerHTML = "我胡汉三回来了";    //Jquery调用方式    $("p").text( "我胡汉三回来了" );    $("p").show();});

0 0