jQuery_显示-隐藏-切换

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>

<p style="display: none">hello world</p>
<input id="show" type="button" value="显示"/>
<input id="hide" type="button" value="隐藏"/>
<input id="toggle" type="button" value="切换"/>

<script src="jquery-3.5.1.js"></script>
<script>

$("#show").click(function () {
$("p").show();
});
$("#hide").click(function () {
$("p").hide(1000);
});
$("#toggle").click(function () {
$("p").toggle(500);
})

</script>

</body>
</html>
posted @ 2020-09-13 10:46  zxy_ang  阅读(408)  评论(0)    收藏  举报