求一个js日期代码,需要在网页上输出的是图片,就是0-9的数字,替换成设计好的图片在网页上显示

 我来答
学霸fy
2013-08-25 · TA获得超过9004个赞
知道大有可为答主
回答量:6519
采纳率:53%
帮助的人:2230万
展开全部

按照以下步骤来:

1、获取当前日期

2、生成日期字符串

3、显示


准备好一张数字的图片:

【代码】

<style type="text/css">

/* css */

.num_0, .num_1, .num_2, .num_3, .num_4, .num_5, .num_6, .num_7, .num_8, .num_9 { background:url(numbers.gif) no-repeat 0 0; display:inline-block; width:40px; height:40px; }

.num_1 { background-position:-40px 0; }

.num_2 { background-position:-80px 0; }

.num_3 { background-position:-120px 0; }

.num_4 { background-position:-160px 0; }

.num_5 { background-position:-200px 0; }

.num_6 { background-position:-240px 0; }

.num_7 { background-position:-280px 0; }

.num_8 { background-position:-320px 0; }

.num_9 { background-position:-360px 0; }

</style>

<div id="dis"></div>

<script>

var date=new Date(),

      str=''+date.getFullYear()+(date.getMonth()+1)+date.getDate(),

      i=0,

      len=str.length,

      html=[];

for(; i<len; i++)

    html.push('<span class="num_'+str[i]+'">&nbsp;</span>');

document.getElementById('dis').innerHTML=html.join('');

</script>

【运行】

运行后,js代码会添加一些元素到页面上,会生成如图所示的结构:

看下页面显示效果:


显示是通过样式表完成的。

推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式