javascript - 更改显示 :none based on date

Question

我正在构建一个站点以在我的平板电脑上本地使用，我不想使用 php。

我有几个 div 需要在不同的日期显示。 IE: div 1 今天显示 div 2 明天显示 div 3 显示第二天 ETC... 这是我必须根据日期更改内容的代码，但这不是我想要做的。如何修改代码以更改显示(我是 js 代码的完全菜鸟):

<script type="text/javascript">
var date=new Date();
var year=date.getFullYear();
var month=date.getMonth();
var day=date.getDate(); // fixed
function SetDivContent() {
    var div=document.getElementById('date_dependent');
    if (year==2014 && month==00) { // fixed (the JavaScript months order is 0-11, not 1-12)
        if (day>=3 && day<29) { // the following content will be displayed 12/03/2010, 12/04/2010, [...], 12/09/2010, 12/10/2010
            div.innerHTML='content 1';
        }
        else if (day==11 || day==12) { // this one will be displayed 12/11/2010 and 12/12/2010
            div.innerHTML='content 2';
        }
        else if (day>12) { // this one - 12/13/2010 and later, until the end of December
            div.innerHTML='content 3';
        }
    }
    else if (year==2014 && month>=0) div.innerHTML='Time to start over!!!'; // OPTIONAL - just to ensure that content 3 is displayed even after December.
}
</script>

Answer 1

假设您的 div 是这样定义的:

<div id="first">content 1</div>
<div id="second">content 2</div>
<div id="third">content 3</div>

您可以使用此 CSS 代码来初始隐藏所有 div:

<style>
#first,#second,#third {
    display:none;
}
</style>

然后这段 js 代码显示合适的:

<script type="text/javascript">
var date=new Date();
var year=date.getFullYear();
var month=date.getMonth();
var day=date.getDate(); // fixed

function SetDivContent() {

    if (year==2014 && month==00) { 
        if (day>=3 && day<29) { 
            $("#first").css("display","block");
        }
        else if (day==11 || day==12) { 
            $("#second").css("display","block");
        }
        else if (day>12) { 
            $("#third").css("display","block");
        }
    }
    else if (year==2014 && month>=0) { 
            $("#third").css("display","block");
        }
    }
</script>

请注意，我还假设您希望在可见时将 div 显示为 block 。如果您需要其他显示值，请将“ block ”更改为“内联”或您需要的任何内容。