如何使用 jQuery 效果?
jqueryweb developmentfront end technology
要隐藏和显示 div，您可以使用 hide 和 show 方法。
用于隐藏
$('#id1').hide();
用于显示
$('#id1').show();
示例
<html >
<head>
<title>showhide</title>
<script src="../../Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#btn1').click(function () {
$('#id1').hide();
});
$('#btn2').click(function () {
$('#id1').show();
});
});
</script>
</head>
<body>
<div>
<p id="id1" style="color:red">I Am A Simple Paragraph</p>
</div>
<button type="button" id="btn1">Hide</button>
<button type="button" id="btn2">Show</button>
</body>
</html>
| 方法 | 描述 |
|---|---|
| animate() | 在选定元素上运行自定义动画 |
| clearQueue() | 从选定元素中删除所有剩余的排队函数 |
| delay() | 为选定元素上的所有排队函数设置延迟 |
| dequeue() | 从队列中删除下一个函数，然后执行该函数 |
| fadeIn() | 淡入选定元素 |
| fadeOut() | 淡出选定元素元素 |
| fadeTo() | 将选定元素淡入/淡出到给定的不透明度 |
| fadeToggle() | 在 fadeIn() 和 fadeOut() 方法之间切换 |
| finish() | 停止、移除和完成选定元素的所有排队动画 |
| hide() | 隐藏选定元素 |
| queue() | 显示选定元素上的排队函数 |
| show() | 显示选定元素 |
| slideDown() | 向下滑动(显示)选定元素元素 |
| slideToggle() | 在 slideUp() 和 slideDown() 方法之间切换 |
| slideUp() | 向上滑动(隐藏)所选元素 |
| stop() | 停止所选元素当前正在运行的动画 |
| toggle() | 在 hide() 和 show() 方法之间切换 |
| addClass() | 向所选元素添加一个或多个类名 |
| after() | 在所选元素后插入内容 |
| append() | 在所选元素末尾插入内容元素 |
| appendTo() | 在选定元素的末尾插入 HTML 元素 |
| attr() | 设置或返回选定元素的属性/值 |
| before() | 在选定元素之前插入内容 |
| clone() | 复制选定元素 |
| css() | 设置或返回选定元素的一个或多个样式属性 |
| detach() | 删除选定元素(保留数据和事件) |
| empty() | 从选定元素中删除所有子节点和内容 |
| hasClass() | 检查 |
| height() | 设置或返回所选元素的高度 |
| html() | 设置或返回所选元素的内容 |
| innerHeight() | 返回元素的高度(包括填充，但不包括边框) |
| innerWidth() | 返回元素的宽度(包括填充，但不包括边框) |
| insertAfter() | 在所选元素后插入 HTML 元素 |
| insertBefore() | 在所选元素前插入 HTML 元素 |
| offset() | 设置或返回所选元素的偏移坐标元素(相对于文档) |
| offsetParent() | 返回第一个定位的父元素 |
| outerHeight() | 返回元素的高度(包括填充和边框) |
| outerWidth() | 返回元素的宽度(包括填充和边框) |
| position() | 返回元素的位置(相对于父元素) |
| prepend() | 在选定元素的开头插入内容 |
| prependTo() | 在选定元素的开头插入 HTML 元素 |
| prop() | 设置或返回选定元素的属性/值 |
| remove() | 删除选定元素(包括数据和事件) |
| removeAttr() | 从选定元素中删除一个或多个属性元素 |
| removeClass() | 从选定元素中删除一个或多个类 |
| removeProp() | 删除 prop() 方法设置的属性 |
| replaceAll() | 用新的 HTML 元素替换选定元素 |
| replaceWith() | 用新内容替换选定元素 |
| scrollLeft() | 设置或返回选定元素的水平滚动条位置 |
| scrollTop() | 设置或返回选定元素的垂直滚动条位置 |
| text() | 设置或返回选定元素的文本内容元素 |
| toggleClass() | 在添加/删除所选元素的一个或多个类之间切换 |
| unwrap() | 删除所选元素的父元素 |
| val() | 设置或返回所选元素的值属性(用于表单元素) |
| width() | 设置或返回所选元素的宽度 |
| wrap() | 用 HTML 元素包裹每个选定元素 |
| wrapAll() | 用 HTML 元素包裹所有选定元素 |
| wrapInner() | 用 HTML 元素包裹每个选定元素的内容元素 |
