<span class=post_date>2009-03-18 02:34 </span>
<span class=post_date>2009-03-19 02:34 </span>
<span class=post_date>2009-01-13 23:34 </span>
<span class=post_date>2009-03-20 11:34 </span>
<script>
var spans = document.getElementsByTagName('span');
var day = 24*60*60*1000;
var now = new Date().getTime(), one = new Date().toDateString();
var two = new Date(now-day).toDateString(), three = new Date(now - day*2).toDateString();
for(var i=0; i<spans.length; i++){
if(spans[i].className=='post_date'){
var d = spans[i].innerHTML.replace('-','/');
var cur = new Date(d).toDateString();
if(cur == one) spans[i].style.color='red';
else if(cur==two) spans[i].style.color='green';
else if(cur == three) spans[i].style.color='blue';
}
}
</script>
<span class=post_date>2009-03-19 02:34 </span>
<span class=post_date>2009-01-13 23:34 </span>
<span class=post_date>2009-03-20 11:34 </span>
<script>
var spans = document.getElementsByTagName('span');
var day = 24*60*60*1000;
var now = new Date().getTime(), one = new Date().toDateString();
var two = new Date(now-day).toDateString(), three = new Date(now - day*2).toDateString();
for(var i=0; i<spans.length; i++){
if(spans[i].className=='post_date'){
var d = spans[i].innerHTML.replace('-','/');
var cur = new Date(d).toDateString();
if(cur == one) spans[i].style.color='red';
else if(cur==two) spans[i].style.color='green';
else if(cur == three) spans[i].style.color='blue';
}
}
</script>
解决方案 »
- 怎样取div的class 不是ID getElementById
- Json索引取key的问题……
- 制作一个可伸缩的大小分类列表,做了能伸开了,但怎么样才能收回呢?
- 如何获得上传文件路径和名字的字符串
- 求键位随机的软键盘 js代码
- onchage事件不能激发
- JS的一个传值问题
- 请问VML中的line线能否变粗?有没有象矩形等的title一样的属性,能鼠标移上去,就显详细说明?
- 请问如何把类似宊宋完编码格式的字符转化成汉字?
- var e=window.event||arguments[0] 是什么意思啊????
- onChange()提交不上去
- 关于用javascript控制多层的显示和隐藏的问题
<html>
<head>
<style type="text/css">
.post_date { color: #0000ff; }
.post_date_now { color:#ff0000; }
.post_date_yest { color:#cccc00; }
.post_date_bef { color:#cc00cc; }
</style>
<SCRIPT LANGUAGE="JavaScript">
<!--
function checkDateColor() {
var dateParts = document.getElementsByTagName('span');
d = new Date();
for(var datePart in dateParts) {
if(dateParts[datePart].group == 'datespan') {
con = new Date(dateParts[datePart].innerHTML.replace('-','/'));
switch(Math.ceil((con - d)/86400000)) {
case 1:
dateParts[datePart].className = 'post_date_now';
break;
case 2:
dateParts[datePart].className = 'post_date_yest';
break;
case 3:
dateParts[datePart].className = 'post_date_bef';
break;
default:
dateParts[datePart].className = 'post_date';
}
}
}
}
//-->
</SCRIPT>
</head>
<body onload="checkDateColor();">
<span class="post_date" group="datespan">2009-03-20 23:34 </span>
<span class="post_date" group="datespan">2009-03-21 23:34 </span>
<span class="post_date" group="datespan">2009-03-22 23:34 </span>
<span class="post_date" group="datespan">2009-04-19 11:34 </span>
</body>
</html>
我这也算是一种方法吧,不和楼上方式不一样,而且加个group可以避免对别的span的影响
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
.post_date{font-weight:bold;}
.pink{color:pink;}
.red{color:red}
.blue{color:blue}
.green{color:green}
.other{color:gray;}
</style>
<script type="text/javascript">
String.prototype.trim = function(){
return this.replace(/^\s+|\s+$/g,'');
}
function $(selector){
return document.getElementById(selector);
}
function $T(selector,context){
return (context||document).getElementsByTagName(selector);
}
function init(){
var sps = $T('span');
var now = new Date(),
todayZero = +new Date(now.getFullYear(),now.getMonth(),now.getDate()),
yestZero = todayZero - 86400000,
beforZero = yestZero - 86400000;
for(var i = 0,len=sps.length ;i<len ; i++){
var sp = sps[i];
if(!/post_date/.test(sp.className)) continue;
var dt = +new Date(sp.innerHTML.trim().replace('-','/')) , cn = '';
if(dt >= +now){
//这种情况没提
cn = 'pink';
}else if(dt>=todayZero){
cn = 'red';
}else if(dt>=yestZero){
cn = 'green';
}else if(dt>=beforZero){
cn = 'blue';
}else{
cn = 'other';
}
sp.className += ' '+cn;
}};
window.onload = init;
</script>
</head><body>
<span class="post_date">2009-03-10 23:34 </span> <br/>
<span class="post_date">2009-03-19 23:34 </span> <br/>
<span class="post_date">2009-03-20 23:34 </span> <br/>
<span class="post_date">2009-03-21 11:34 </span> <br/>
<span class="post_date">2009-03-22 11:34 </span> <br/>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>时间变色</title>
<script type="text/javascript">
var time=new Date();
var yy=time.getFullYear();
var mm=time.getMonth()+1;
var dd=time.getDate();
function IsDateTime(t){
var re = /^(\d{1,4})(-)(\d{1,2})\2(\d{1,2}) (\d{1,2}):(\d{1,2})/;
return re.test(t);
}function changColor(_obj,_time){
var _yy=_time.split(" ")[0].split("-")[0];
var _mm=_time.split(" ")[0].split("-")[1];
var _dd=_time.split(" ")[0].split("-")[2];
if(_yy<yy ||_mm<mm||_yy<=yy && _mm<=mm && _dd<dd )//今天以前
_obj.style.color="#0d9";
else if (_yy==yy && _mm==mm && _dd==dd)//今天
_obj.style.color="#d00";
else if (_yy>yy ||_mm>mm||_yy>=yy && _mm>=mm && _dd>dd) //今天以后
_obj.style.color="#66f";
}onload=function(){
// var obj=document.getElementById("???").getElementsByTagName("span"),j=obj.length;
var obj=document.getElementsByTagName("span"),j=obj.length;
for (var i=0;i<j;i++){
var tmp=obj[i].innerHTML;
if (obj[i].className=="post_date" && IsDateTime(tmp))
changColor(obj[i],tmp);
}
}
</script>
</head><body>
<span class="post_date">2009-04-19 23:30 </span> <br/>
<span class="post_date">2009-03-20 23:30 </span> <br/>
<span class="post_date">2009-03-21 23:30 </span> <br/>
<span class="post_date">2009-03-22 23:30 </span> <br/>
<span class="post_date">2009-02-23 23:30 </span> <br/>
</body>
</html>