<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>夜晚模式</title>
<script>
function mySwich() {
var oBody = document.getElementById("myBody");
var oOnoff = document.getElementById("myOnoff");
if (oOnoff.src.match("1509")){
oOnoff.src="https://timgsa.baidu.com/timg?image&quality=80&size=b10000_10000&sec=150";
oBody.style.background="black";
oBody.style.color="green";
}else {
oOnoff.src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1509";
oBody.style.background="white";
oBody.style.color="pink";
}
}
</script>
</head>
<body id="myBody">
<img id="myOnoff" onclick="mySwich()" src="https://timgsa.baidu.com/timg?image&quality=80&size=b10000_10000&sec=150" width="60px">
<script>
document.write(Date())
</script>
</body>
</html>
—————————————————————————————————————————————————————————————————————————————————————————————————————————————————————
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>base</title>
<link rel="stylesheet" href="../static/css/base.css" type="text/css">
<script src="../static/js/base.js"></script>
</head>
<body id="myBody">
<nav>
<img id="myOnOff" onclick="mySwitch()"
src="http://pic.58pic.com/58pic/12/38/64/52Y58PICFWV.jpg" width="100"height="50">
<a href="http://www.narutom.com/video/">首页</a>
<input type="text">
<button>查找</button>
</nav>
<div class="area">
</div>
<div class="area1">
<div class="img">
<a href="https://baike.baidu.com/item/%E6%BC%A9%E6%B6%A1%E9%B8%A3%E4%BA%BA/322717?fr=aladdin"><img
src="http://img3.imgtn.bdimg.com/it/u=1024789900,1375050730&fm=214&gp=0.jpg"></a>
<div class="desc"><a href="https://baike.baidu.com/item/%E6%BC%A9%E6%B6%A1%E9%B8%A3%E4%BA%BA/322717?fr=aladdin">漩涡鸣人</a></div>
</div>
<div class="img">
<a href="https://baike.baidu.com/item/%E5%AE%87%E6%99%BA%E6%B3%A2%E4%BD%90%E5%8A%A9">
<img src="http://dl.bizhi.sogou.com/images/2012/04/17/232306.jpg"></a>
<div class="desc"><a href="https://baike.baidu.com/item/%E5%AE%87%E6%99%BA%E6%B3%A2%E4%BD%90%E5%8A%A9">宇智波佐助</a></div>
</div>
<div class="img">
<a href="https://baike.baidu.com/item/%E8%87%AA%E6%9D%A5%E4%B9%9F/7041?fr=aladdin">
<img src="http://img3.imgtn.bdimg.com/it/u=3803389959,1787876432&fm=214&gp=0.jpg"></a>
<div class="desc"><a href="https://baike.baidu.com/item/%E8%87%AA%E6%9D%A5%E4%B9%9F/7041?fr=aladdin">自来也</a>
</div>
</div>
</div>
<br>
<br>
</body>
</html>
.img {
border: 1px solid #cccccc;
300px;
margin: 5px;
float: left;
}
div.img img {
100%;
height: auto;
}
div.desc {
text-align: center;
padding: 5px;
}
div.img:hover {
border: 1px solid #000000;
}
.area {
height: 100px;
}
.area1 {
height: 180px;
}
function mySwitch() {
var oBody = document.getElementById("myBody");
var oOnoff = document.getElementById("myOnOff");
if (oOnoff.src.match(1606497334)) {
oOnoff.src = "http://pic.58pic.com/58pic/12/38/64/52Y58PICFWV.jpg";
oBody.style.background = "black";
oBody.style.color = "yellow";
} else {
oOnoff.src = "http://wenwen.soso.com/p/20101019/20101019113210-1606497334.jpg";
oBody.style.background = "white";
oBody.style.color = "black";
}
}