1

我正在制作一个显示商店营业时间的简单插件。我已经对其进行了编码,它看起来相当不错。它显示为类似于我在下面键入的列表。

周一 - 上午 9:00 至下午 5:00
周二 - 上午 9:00 至下午 5:00
周三 - 上午 9:00 至下午 5:00

...等等。生成的 HTML 如下所示:

<div id="%id%container">
    <div id="%id%title">%text="Opening Hours"%</div>
    <ul class="%id%hours">
        <li>Monday<span>%text="9:00AM - 5:00PM"%</span></li>
        <li>Tuesday<span>%text="9:00AM - 5:00PM"%</span></li>
        <li>Wednesday<span>%text="9:00AM - 5:00PM"%</span></li>
        <li>Thursday<span>%text="9:00AM - 5:00PM"%</span></li>
        <li>Friday<span>%text="9:00AM - 5:00PM"%</span></li>
        <li>Saturday<span>%text="9:00AM - 5:00PM"%</span></li>
        <li>Sunday<span>%text="9:00AM - 5:00PM"%</span></li>
    </ul>
</div>

假设今天是星期二。与其读“星期二”,不如说“今天”。有没有办法只用Javascript(客户端)来完成这个?

谢谢你。

4

3 回答 3

3

您应该能够利用 javascript 中的 getDay() 方法来确定星期几,然后以编程方式替换它。

http://www.w3schools.com/jsref/jsref_getday.asp

编辑:看到源代码后,我认为如果您将 id 属性添加到列表项以供参考,这会更容易。然后,如果您的 ID 是 day0、day1、day2 等,则可以使用如下所示的 javascript。

<script type="text/javascript">
  var d = new Date();
  var obj = document.getElementById('day' + d.getDay);
  // TODO - replace day of the week on the 'obj' object
</script>

不确定您是否打算使用像 jQuery 这样的 javascript 框架,但它会以包含源代码为代价使其不那么冗长。

于 2013-01-04T00:59:12.243 回答
0

看看moment.js。它应该允许你做你想做的事。

于 2013-01-04T01:00:15.917 回答
0

在这里,纯 JS 解决方案:

<div id="%id%container">
    <div id="%id%title">%text="Opening Hours"%</div>
    <ul class="%id%hours">
        <li>Monday<span>%text="9:00AM - 5:00PM"%</span></li>
        <li>Tuesday<span>%text="9:00AM - 5:00PM"%</span></li>
        <li>Wednesday<span>%text="9:00AM - 5:00PM"%</span></li>
        <li>Thursday<span>%text="9:00AM - 5:00PM"%</span></li>
        <li>Friday<span>%text="9:00AM - 5:00PM"%</span></li>
        <li>Saturday<span>%text="9:00AM - 5:00PM"%</span></li>
        <li>Sunday<span>%text="9:00AM - 5:00PM"%</span></li>
    </ul>
</div>
var dayNames = ["Sunday","Monday","Tuesday","Wednesday","Thirsday","Friday","Saturday"];
var dayOfWeek = new Date().getDay();
var dayOfWeekText = dayNames[dayOfWeek]
var elements = document.querySelectorAll('div[id="%id%container"] ul[class="%id%hours"] li');

window.onload = function(){
    for (var i=0; i < elements.length; i++ ){
        if (elements[i].innerHTML.indexOf(dayOfWeekText) != -1){
            elements[i].innerHTML = elements[i].innerHTML.replace(new RegExp(dayOfWeekText),'Today');
            return false;
        }
    }
}

JSFIDDLE

于 2013-03-02T15:19:10.107 回答