<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title></title>
</head>
<style type="text/css">
.top-nav {
font-size: 14px;
font-weight: bold;
list-style: none;
}
.top-nav li {
float: left;
margin-left: 1px;
}
.top-nav li a {
line-height: 34px;
text-decoration: none;
background: #3f240e;
color: #fff;
display: block;
width: 80px;
text-align: center;
}
.top-nav ul {
list-style: none;
display: none;
padding: 0;
position: absolute;
height: 0;
overflow: hidden;
}
.top-nav li a:hover {
background: url(images/slide-bg.png) 0 0 repeat-x;
}
.note {
color: #3f240e;
display: block;
background: url(images/slide-bg.png) 0 0 repeat-x;
}
.corner {
display: block;
height: 11px;
background: url(images/corner.png) 31px 0 no-repeat;
}
</style>
<script type="text/javascript">
window.onload = function() {
var Lis = document.getElementsByTagName("li");
var timer=null;
for(var i=0; i<Lis.length; i++) {
Lis[i].onmouseover = function() {
var u = this.getElementsByTagName("ul")[0];
if(u != undefined) {
u.style.display = "block";
clearInterval(timer);
timer=setInterval(AddH,10);
}
}
Lis[i].onmouseout = function() {
var u = this.getElementsByTagName("ul")[0];
if(u != undefined) {
clearInterval(timer);
timer=setInterval(SubH,100);
}
}
}
}
function AddH() {
var ulList = document.getElementById("mnuUL");
var h = ulList.offsetHeight;
h += 1;
if(h>42) {
return;
}
else {
ulList.style.height = h + "px";
}
}
function SubH() {
var ulList = document.getElementById("mnuUL");
var h = ulList.offsetHeight;
h -= 1;
if(h <=0) {
ulList.style.height =0;
}
else {
ulList.style.display =h + "px";
}
}
</script>
<body>
<ul class="top-nav">
<li><a href="#"><span class="note">慕课网</span></a></li>
<li><a href="#">课堂大厅</a></li>
<li><a href="#">学习中心</a>
<ul id="mnuUL">
<span class="corner"></span>
<li><a href="#">前端课程</a></li>
<li><a href="#">手机开发</a></li>
<li><a href="#">后台编程</a></li>
</ul>
</li>
<li><a href="#">关于我们</a></li>
</ul>
</body>
</html>
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
If it needs to be eliminated, then
You posted such a large piece of code, but you didn’t make it clear what purpose you wanted to send it to or what kind of problems you encountered.
This way of writing is not very good~
If you are self-study, it is recommended to find some newer and better-produced resources, or MDN, don’t be led astray
How to optimize specifically, here are two tips:
Event Agent
Closure