您的位置：首页 > Web前端 > JavaScript

对前端JavaScript也很有兴趣，正在看《JavaScript 权威指南》第二部分浏览器JavaScript

2013-10-30 17:08 555 查看

这本书,很久前看过第一部分

最近发现自己对前端也很感兴趣，手打了一把 13-1 例子的代码很爽。

<!DOCTYPE html>
<html>
<head>
<style>
.revealed * {display: block;}
.reveal * {
display: none;
}

.reveal *.handle {
display: block;
}

</style>
<script>
(function(){  window.onload = function () {
var elements = document.getElementsByClassName("reveal");

for (var i = 0; i < elements.length; i++) {
var elt = elements[i];
var title = elt.getElementsByClassName("handle")[0];

addRevealHandler(title, elt);
}

function addRevealHandler(title, elt) {
title.onclick = function () {
if (elt.className == "reveal")
elt.className = "revealed";
else if (elt.className == "revealed")
elt.className = "reveal";
}
}

};}())
</script>
</head>
<body>
<div class="reveal">
<h1 class="handle">这里显示隐藏文字</h1>

<p>这些文字是隐藏的，当你点击的时候显示</p>
</div>
</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航

对前端JavaScript也很有兴趣，正在看《JavaScript 权威指南》第二部分 浏览器JavaScript

对前端JavaScript也很有兴趣，正在看《JavaScript 权威指南》第二部分浏览器JavaScript