視頻 網站 頁面開關燈實現方法
在甲骨文學習 已經進行了四分之一了， 關於web 的學習基本結束了， 在項目展示的時候遇到了 視頻網站開關燈的問題， 其實問題的根本就是 做兩個div， 然後開燈的時候隱藏一個 關燈的時候 隱藏另一個。過程通過js來實現，下面是基本過程；
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>無標題文檔</title>
</head>
<script type="text/javascript">
function one(){
var qq = document.getElementById("div1");
qq.setAttribute("class","aaa");
var ww = document.getElementById("div2");
ww.setAttribute("class","bbb");
}
function two(){
var ee = document.getElementById("div1");
ee.setAttribute("class","aa");
var rr = document.getElementById("div2");
rr.setAttribute("class","bb");
}
</script>
<style>
.aaa{
display: none;
}
.bb{
display: none;
}
</style>
<body>
<div id="div1" class="aa">
<div id="gdan" onClick="one()">關燈</div>
</div>
<div id="div2" class="bb">
<div id="kdan" onClick="two()" style="background-color: black; color: aliceblue">開燈</div>
</div>
</body>
</html>
視頻 網站 頁面開關燈實現方法