html JS.Objects.Playing with Date:计算一周中每天生日的出现次数

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了html JS.Objects.Playing with Date:计算一周中每天生日的出现次数相关的知识,希望对你有一定的参考价值。

table, th, td {
   border: 1px solid black;
  text-align:center;
}

function computeBirthdays() {
  // An array. Each element is the number of times my birthday
  // will occur. For the moment: 0 times on a Monday, 0 times on Friday
  // etc.
  var dayOfTheWeek = [0,0,0,0,0,0,0];

  
  var birthday = document.querySelector("#birthday").value;
  
  // birthday is the value of the input field, 
  // as a string (ex: "1965-4-16")
  // Let's turn it into a Date object
  var birthdayAsDate = new Date(birthday);
  
  // Get the month and year (ex: 16 April)
  var birthdayMonth = birthdayAsDate.getMonth(); // ex: April
  var birthdayDate  = birthdayAsDate.getDate();   // ex: 16
  

  var startYear = document.querySelector("#start").value;
  var endYear = document.querySelector("#end").value;
  
  for (var year = startYear; year <= endYear; year++) {
      var dayOfTheWeekMyBirthDayOccurs = 
          new Date(year, birthdayMonth, birthdayDate).getDay();
  
        console.log('Year : ' + year + " Day of your birthday: " + 
                    getDayName(dayOfTheWeekMyBirthDayOccurs));

      // increment the counter for this day
      dayOfTheWeek[dayOfTheWeekMyBirthDayOccurs]++;
   }

   // add a table to the web page, presenting the results
   displayResults(dayOfTheWeek);

}

function getDayName(dayIndex) {
  var days = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
  return days[dayIndex];
}

function displayResults(array) {
  document.querySelector("#results").innerHTML = "<p>Occurences of your Birthday:</p>";
  
  var table = document.createElement("table");
  var firstRow = table.insertRow();
  var secondRow = table.insertRow();
  
  
  array.forEach(function(dayOccurence, index) {
    var dayNameCell = firstRow.insertCell(index);
    dayNameCell.innerHTML = getDayName(index);
    
    var nbCell = secondRow.insertCell(index);
    nbCell.innerHTML = dayOccurence;
    
  });
  
  document.querySelector("#results").appendChild(table);
}
JS.Objects.Playing with Date: computing occurences of a birthday per day of the week
------------------------------------------------------------------------------------


A [Pen](https://codepen.io/Onlyforbopi/pen/dqxwGb) by [Pan Doul](https://codepen.io/Onlyforbopi) on [CodePen](https://codepen.io).

[License](https://codepen.io/Onlyforbopi/pen/dqxwGb/license).
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Compute day occurences of your birthday</title>
</head>
<body>
  <label for="birthday">Your birthday: </label><input id="birthday" type="date" value="1965-04-16">
  <p>Please enter a starting and an ending year, then click the button.</p>
  <label for="start">Start year:</label>
  <input type=number id="start" value=2017 min=1965 max=3000>
  <p></p>
  <label for="end">End year:</label>
  <input type=number id="end" value=2047 min=1965 max=3000>
  <p></p>
  <button onclick="computeBirthdays();">
    Compute how many times 
    your birthday will occur, 
    for each day of the week
  </button>
  <p></p>
  <output id="results"></output>  
</body>
</html>

以上是关于html JS.Objects.Playing with Date:计算一周中每天生日的出现次数的主要内容,如果未能解决你的问题,请参考以下文章

html Klawiatura numeryczna w HTML5

HTML5 srcset:混合 x 和 w 语法

html 角w

html 俄罗斯方块w /高分跟踪

html Inicjalizacja DatePickera w tabeli

html 项目分页w变异观察员