如何从星期六到星期五的日历的每个星期以不同的颜色着色

Question

我正在使用此Bootstrap Datepicker和我设法选择从星期六到星期五的整个星期，但我也想从星期六到星期五的每个星期用不同的颜色上色，但是不知道怎么做

甚至是将鼠标悬停在从星期六到星期五的一周上色都可以完成工作

// clear value of input
    $('#weeklyDatesPicker').on('focus', function(){
      $(this).val('');
    })


        moment.updateLocale('en', {
          week: { dow: 1 },
          useCurrent: false
        });

      //Initialize the datePicker
      $("#weeklyDatesPicker").datetimepicker({
          format: 'MM-DD-YYYY'
      });

       //Get the value of Start and End of Week
      $('#weeklyDatesPicker').on('dp.change', function (e) {
          var value = $("#weeklyDatesPicker").val();
          var firstDate = moment(value, "MM-DD-YYYY").day(-1).format("MM-DD-YYYY");
          var lastDate =  moment(value, "MM-DD-YYYY").day(5).format("MM-DD-YYYY");
          $("#weeklyDatesPicker").val(firstDate + " / " + lastDate);
      });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/js/bootstrap-datetimepicker.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/css/bootstrap-datetimepicker.min.css">
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">

              <div class="form-group col-md-12">
 
                <input class="form-control" type='text' id='weeklyDatesPicker' placeholder="" />
              </div>

Answer 1

使用.datepicker tbody tr:nth-child(n)选择器，从n中选择1-6六行