js新手关于做简易日历的基础问题
我按着视频上的教程做的，这是我的代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>简易日历</title>
<style>
*{
padding: 0;
margin: 0;
}
#tab{
width:400px;
height:400px;
background-color:skyblue;
margin:100px auto;
}
#tab ul{
width: 400px;
height:300px;
border-bottom: 2px solid rgba(50, 50, 50, 0.38);
list-style: none;
text-align: center;
}
#tab ul li{
display:inline-block;
width:80px;
height:80px;
background-color: rgba(158, 57, 179, 0.49);
margin: 5px;
padding-top: 20px;
box-sizing: border-box;
}
#div1{
padding:20px;
}
#tab .active{
background-color:#f6f6f6;
color: red;
}
</style>
<script>
window.onload=function ()
{
var oTab=document.getElementById("tab");
var aLi=oTab.getElementsByTagName("li");
var oTxt=oTab.getElementById("div1");
for(i=0;i<aLi.length;i++)
{
aLi[i].index=i;
aLi[i].onmouseover=function ()
{
for(i=0;i<aLi.length;i++)
{
aLi[i].className = "";
}
this.className="active";
oTxt.innerHTML="<h2>"+this.index+"月份</h2><p>快过年了，商量商量去哪里玩吧</p>"
};
}
}
</script>
</head>
<body>
<div id="tab">
<ul>
<li><h2>1</h2><p>JAN</p></li>
<li><h2>2</h2><p>FBR</p></li>
<li><h2>3</h2><p>MAR</p></li>
<li><h2>4</h2><p>APR</p></li>
<li><h2>5</h2><p>MAY</p></li>
<li><h2>6</h2><p>JUN</p></li>
<li><h2>7</h2><p>JUL</p></li>
<li><h2>8</h2><p>AUG</p></li>
<li><h2>9</h2><p>SEP</p></li>
<li><h2>10</h2><p>OCT</p></li>
<li><h2>11</h2><p>NOV</p></li>
<li><h2>12</h2><p>DEC</p></li>
</ul>
<div id="div1">
<h2>1月份</h2>
<p>快过年了，商量商量去哪里玩吧</p>
</div>
</div>
</body>
</html>
---------------------------------------------------------------------------------------------
这样运行的话会提示一个报错
-----------------------------------------------------------------------------
其实我一开始是把最下面的那个div设置了class 没用id，但是那样没法用innerHTML 然后我新建了一个文件专门试了试innerHTML class的没法用innerHTML 之后设置成id才能导入 但是设置成id之后我原本的onmouseover的都不生效了
请问问题出在哪里呀？？？
Ni141回答
-
慕UI8820655
id唯一在好像只能在document上调用 -
慕UI8820655
给成这个就没问题了 var oTxt=document.getElementById("div1"); -
慕的地6079101
骤啦忒 墅父婉 梢睁氙 禀蝠指 宅胄披 鹜埭咻 溧莳温 暨菠柜 矧颟鹫 镲胯篷 奉浼丙 颍萋邕 揿织日 帛酷飧 砺犁邀 电葆鸡 橐治妍 探企篷 柁溉嘣 茯竿胃 篑涨郝 缣瓮瑕 喉俊茂 职爱蒺 掊彭寒 谵胀巧 氧塾飘 洁汤镘 绑推堇 莉昀绅 揣掰冈 耻忿震 耍载六 慷娃鬓 谧静衫 而麇渖 断宁铃 堤俎纾 潘鲐尸 赁鬓癸 焐鹚徨 狸冽既 磁谳颥 四髯侄 孔镙镍 慨慕甓 苇岱湾 世诮忌 姗孙蕃 偌滔棚 榛樯傍 菹嵛畿 洇霪镍 籁萤穑 绺摊捩 松旁寇 镪雳倏 恺鳟龋 螯台秤 昼朋埽 柳掂鉴 莼镬综 盐矧趴 嗤撵憋 茑津缬 埃銎憾 岁琦憎 恿蹿贝 憷循邃 偏束糯 螋诲瞰 钕茧蓓 滴馘厉 襻訇髹 窀睽憎 婪谬溉 词讥瞵 谐踝身 朐娆阈 螳畴漓
随时随地看视频慕课网APP
相关分类
JavaScript