js实例-数组实现简单日历的代码
发布时间:2014-10-02 编辑:jiaochengji.com
为大家介绍如何使用javascript中的数组来实现简单的日历效果,有需要的朋友,可以参考下。
代码如下:
<script type="text/javascript"> /** * 获取数组内容实现简单日历效果 * by http://www.jbxue.com */ var myarr=[ "第一个月比较寒冷", "第二月大年的日子", "第三月开春的日子降临了。", "第四个月是个准备迎接夏天到来的日子了。", "第五个月", "第六个月", "第七个月", "第八个月", "第九个月", "第十个月", "第十一个月", "第十二个月" ] window.onload=function() { var ouli=document.getElementById('uli').getElementsByTagName('li'); var otxt=document.getElementById('civ'); var i=0; for(i=0;i<ouli.length;i++) { ouli[i].index=i; ouli[i].onclick=function() { for(i=0;i<ouli.length;i++) { ouli[i].className=""; }; this.className="active"; otxt.innerHTML="<h2>"+(this.index+1)+"月活动</h2><p>"+myarr[this.index]+"</p>" }; }; <script> <ul id="uli"> <li class="active">1</li> <li>2</li> <li>3</li> <li>4</li> <li>5</li> <li>6</li> <li>7</li> <li>8</li> <li>9</li> <li>10</li> <li>11</li> <li>12</li> </ul> <div id="civ"> <h2>1月活动</h2> <p>第一个月比较寒冷</p> </div>
您可能感兴趣的文章:
js实例-数组实现简单日历的代码
php简单日历的实现代码(可绑定事件)
js数组声明与数组遍历的方法
php日历代码(附演示效果)
javascript日期对象格式化为字符串
为开发者准备的10款最好的jQuery日历插件
PHP汉字拼音转换、公历农历转换的实例详解
js split函数用法示例
php日历代码 php实现的高效日历代码
js数组赋值实例
上一篇:js删除前提示确认的代码一例
下一篇:iframe自适应宽度和高度的函数一例
[关闭]