标签：isa type owb app 概览 网易 style news 隐藏和显示
(点击图片进入关卡)
使元素消失和出现！惊吓你的敌人，迷惑你的朋友。
简介
show() 和 hide() 这两个jQuery函数分别让元素出现和消失。
默认代码
<!-- JavaScript可以用来显示和隐藏元素！ -->
<script>
var showButton = $("#showButton");
// 创建变量‘hideButton‘来存储#hideButton
var image = $("#image");
function showElement() {
image.show();
}
function hideElement() {
// 在图像变量上使用“hide（）”函数：
}
showButton.on("click", showElement);
// 添加一个事件监听器到hideButton变量。
// 当“点击”发生时，它应该执行HielEng:
</script>
<style>
body {
text-align:center;
}
button {
width:25%;
height:64px;
}
img {
width:50%;
}
</style>
<button id="showButton">显示</button>
<button id="hideButton">隐藏</button>
<br>
<img id="image"
src="http://direct.codecombat.com/file/db/thang.type
/57586f0a22179b2800efda37/portrait.png"/>
概览
＃隐藏并显示
在元素上调用 hide() 会使元素从屏幕上消失！
与此相反， show() 则会让元素按照隐藏前的样子重新出现。 （除非在隐藏时进行过更改！）
挂接到 "click" 事件则可以为需要的隐藏和显示行为编写强大的脚本！
消失活动 解法
<!-- JavaScript可以用来显示和隐藏元素！ -->
<script>
var showButton = $("#showButton");
// 创建变量‘hideButton‘来存储#hideButton
var hideButton = $("#hideButton");
var image = $("#image");
function showElement() {
image.show();
}
function hideElement() {
// 在图像变量上使用“hide（）”函数：
image.hide()
}
showButton.on("click", showElement);
// 添加一个事件监听器到hideButton变量。
// 当“点击”发生时，它应该执行HielEng:
hideButton.on("click", hideElement);
</script>
<style>
body {
text-align:center;
}
button {
width:25%;
height:64px;
}
img {
width:50%;
}
</style>
<button id="showButton">显示</button>
<button id="hideButton">隐藏</button>
<br>
<img id="image"
src="http://direct.codecombat.com/file/db/thang.type
/57586f0a22179b2800efda37/portrait.png"/>
「网易官方」极客战记（codecombat）攻略-网页开发2-消失活动-disappearing-act
标签：isa type owb app 概览 网易 style news 隐藏和显示
原文地址：https://www.cnblogs.com/codecombat/p/12918831.html
