到目前为止,我有很多代码,但我无法让 load() 函数工作:
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Page resizer -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<!-- Date -->
<script>
var d = new Date();
var days = ["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"];
document.getElementById("date").innerHTML = days[d.getDay()];
</script>
<!-- Gif changer -->
<script>
function changegif() {
var gif;
if (days = Sunday) {
gif = "/img/sunday.gif";
} else if (days = Monday) {
gif = "/img/monday.gif";
} else if (days = Tuesday) {
gif = "/img/tuesday.gif";
} else if (days = Wednesday) {
gif = "/img/wednesday.gif";
} else if (days = Thursday) {
gif = "/img/thursday.gif";
} else if (days = Friday) {
gif = "/img/friday.gif";
} else if (days = Saturday) {
gif = "/img/saturday.gif";
}
}
function load() {
document.getElementById('gif').src = changegif();
}
</script>
</head>
<body onload="load()">
<!-- More date stuff -->
<style>
.image {
position: relative;
width: 100%; /* for IE 6 */
}
h2 {
position: absolute;
top: 150px;
left: 0;
width: 100%;
}
h2 span {
color: white;
font: bold 24px/45px Helvetica, Sans-Serif;
letter-spacing: -1px;
background: rgb(0, 0, 0); /* fallback color */
background: rgba(0, 0, 0, 0.7);
padding: 10px;
}
h1 {
position: absolute;
top: 200px;
left: 0;
width: 100%;
}
h1 span {
color: white;
font: bold 24px/45px Helvetica, Sans-Serif;
letter-spacing: -1px;
background: rgb(0, 0, 0); /* fallback color */
background: rgba(0, 0, 0, 0.7);
padding: 10px;
}
</style>
<div class="image">
<img src="#" id="gif">
<h2><span>Enjoy Your</span></h2>
<br>
<h1 id="date"><span></span></h1>
</div>
</body>
</html>
如果有人知道我做错了什么,请告诉我。我尝试将这些功能集成到按钮中,但仍然不起作用。
删除所有你自己的<script>
,然后使用这个:
function load() {
var day = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"][new Date().getDay()];
document.getElementById("date").innerHTML = day;
document.getElementById('gif').src = "/img/" + day.toLowerCase() + ".gif";
}
解释所有错误:
-
=
分配;它不比较。 -
changegif
不会返回任何内容,因此document.getElementById('gif').src = changegif();
始终将其设置为undefined
(假设没有其他错误)。 -
Sunday
和其他人是未声明的变量名;它们只能作为字符串工作:"Sunday"
。 -
days
不是一天,而是整个数组,因此将其与一天进行比较是行不通的。
changegif
可以简化为:
function changegif(){
return "/img/"
+ days[d.getDay()].toLowerCase()
+ ".gif";
}
或者使用克里斯·