更改bg颜色/给当天的边框

时间:2017-11-19 11:38:01

标签: javascript jquery html css border

我真的很想知道如何使用当前时间更改表格行以突出显示/更改bg颜色。

我在一张桌子上有7天的时间用于开店时间,我想以不同的颜色突出当天。只是一种我想要实现的美容效果。任何帮助表示赞赏。

我不是编码员,但我的想法是获得当前时间是不够的;它必须用于通过id左右来匹配任何工作日,就像今天是星期日一样,行中的文本也是'星期日',所以它知道它必须改变TD的bg颜色。

这有可能吗?任何帮助表示赞赏。 :)

2 个答案:

答案 0 :(得分:1)

确实你必须在javascript之后得到当前的一天: https://www.w3schools.com/jsref/jsref_getday.asp

然后你只需得到相应的单元格并设置一个特定的css类:

#include<iostream>                                                                                                                                                                                                                                                                                                                                                                                                                                          
#include<unordered_map>                                                                                                                                                                                                                    

using namespace std;                                                                                                                                                                                                                       
class Line {                                                                                                                                                                                                                               
public:                                                                                                                                                                                                                                    
  float m;                                                                                                                                                                                                                                 
  float c;                                                                                                                                                                                                                                 

  Line() {m = 0; c = 0;}                                                                                                                                                                                                                   
  Line(float mInput, float cInput) {m = mInput; c = cInput;}                                                                                                                                                                               
  float getM() const {return m;}                                                                                                                                                                                                           
  float getC() const {return c;}                                                                                                                                                                                                           
  void setM(float mInput) {m = mInput;}                                                                                                                                                                                                    
  void setC(float cInput) {c = cInput;}                                                                                                                                                                                                    

  bool operator==(const Line &anotherLine) const                                                                                                                                                                                           
    {                                                                                                                                                                                                                                      
      return (m == anotherLine.m);                                                                                                                                                                                                         
    }                                                                                                                                                                                                                                      
};                                                                                                                                                                                                                                         

namespace std                                                                                                                                                                                                                              
{                                                                                                                                                                                                                                          
  template <>                                                                                                                                                                                                                              
  struct hash<Line>                                                                                                                                                                                                                        
  {                                                                                                                                                                                                                                        
    size_t operator()(const Line& k) const                                                                                                                                                                                                 
      {                                                                                                                                                                                                                                    
        // Compute individual hash values for two data members and combine them using XOR and bit shifting                                                                                                                                 
        return ((hash<float>()(k.getM()) ^ (hash<float>()(k.getC()) << 1)) >> 1);                                                                                                                                                          
      }                                                                                                                                                                                                                                    
  };                                                                                                                                                                                                                                       
}                                                                                                                                                                                                                                          

int main()                                                                                                                                                                                                                                 
{                                                                                                                                                                                                                                          
  unordered_map<Line, int> t;                                                                                                                                                                                                              

  Line line1 = Line(3.0,4.0);                                                                                                                                                                                                              
  Line line2 = Line(3.0,5.0);                                                                                                                                                                                                              

  t.insert({line1, 1});                                                                                                                                                                                                                                                                                                                                                                                                                                      
  auto x = t.insert({line2, 2});                                                                                                                                                                                                           
  if (x.second == false)                                                                                                                                                                                                                   
    cout << "insert failed" << endl;                                                                                                                                                                                                       

  for(unordered_map<Line, int>::const_iterator it = t.begin(); it != t.end(); it++)                                                                                                                                                        
  {                                                                                                                                                                                                                                        
    Line t = it->first;                                                                                                                                                                                                                    
    cout << t.m << " " << t.c << "\n" ;                                                                                                                                                                                                    
  }                                                                                                                                                                                                                                        

  return 1;                                                                                                                                                                                                                                
}    
var d = new Date();
var n = d.getDay();

document.getElementById(n).className = "bg";
.bg{
  background-color:#939393;
  border:solid 1px;
}

答案 1 :(得分:0)

<table>
  <tr><td>Sunday</td></tr>
  <tr><td>Monday</td></tr>
  <tr><td>Tuesday</td></tr>
  <tr><td>Wednesday</td></tr>
  <tr><td>Thursday</td></tr>
  <tr><td>Friday</td></tr>
  <tr><td>Saturday</td></tr>
</table>

// Jquery

$(function(){
  var weekday = ["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"];
  var date = new Date();
  var currentDay = weekday[date.getDay()];

  $('table td').each(function() {
    if($(this).html() == currentDay)
      $(this).addClass('active');
  });

})

//CSS

table tr td{
  border: 1px solid gray;
  background-color: #082768;
  color: #fff;
}
table tr td.active{
  background-color: red;
  color: #fff;
}

工作小提琴https://jsfiddle.net/d2tfo790/1/