导入JQuery.js文件
方法一,官网下载jquery-min.js,然后引入js文件
方法二,使用在线的jq <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
图片的显示与隐藏
<body>
<img src="img/img01.jpg" width="200px" height="200px" />
<button id="show">显示</button>
<button id="hide">隐藏</button>
<script type="text/javascript">
$(function() {
//显示
$("#show").click(function() {
$("img").show(2000);
});
//吟唱
$("#hide").click(function() {
$("img").hide(2000);
});
})
</script>
</body>
列表样式
<body>
<h3>课程</h3>
<ul style="display: none">
<li class="current">C语言</li>
<li>java</li>
<li>c++</li>
</ul>
<script type="text/javascript">
$(function() {
$("h3").click(function(){
$("ul").toggle();
})
$("li").click(function(){
$(this).addClass("current").siblings("li").removeClass("current")
});
})
</script>
</body>