JavaScript show() hide() 使用方法
1、新建一个div、button,定义class,(定义随意)

2、运行一下,效果如图

3、然后引入如下
<script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
不然不会有效果!

4、引入js的方法:下载地址
点击即可下载,然后复制,粘贴到当前项目的js文件夹


5、新建<script></script>标签,写入要实现的效果代码
一般放在<body></body>标签的紧跟的后边(我个人这么写,仅供参考),
如图所示:

6、最后运行:YC(隐藏) XS(显示)


7、代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>show() hide() 用法</title>
<script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
<style>
.photo{
width: 512px;
height: 630px;
}
</style>
</head>
<body>
<div class="photo">
<img src="img/1.jpg" alt="这里有图片" />
</div>
<button class="YC">YC</button>
<button class="XS">XS</button>
</body>
<script>
//隐藏
$('.YC').click(function(){
$('.photo').hide();
});
//显示
$('.XS').click(function(){
$('.photo').show();
});
</script>
</html>
