如果元素是可见的,切换为隐藏的;如果元素是隐藏的,切换为可见的。
案例展示:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script src="../Scripts/jquery-1.11.3.js"></script>
<style>
div {
width: 200px;
margin: auto;
}
.HP_JQuery {
background-color: #ff0000;
}
.txt_content {
background-color: #00ffff;
}
</style>
<script>
$(function () {
//点击切换显示隐藏 500毫秒
$("#cool .HP_JQuery").click(function () {
$(".txt_content").toggle(500);
});
})
</script>
<meta charset="utf-8" />
</head>
<body>
<div id="cool">
<h4 class="HP_JQuery">什么是JQuery?</h4>
<div class="txt_content">
jQuery是一个快速、简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架)。jQuery设计的宗旨是“write Less,Do More”,即倡导写更少的代码,做更多的事情。它封装JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档操作、事件处理、动画设计和Ajax交互。
</div>
</div>
</body>
</html>