Question

＆＃13;

// Declare Variables;
var year = document.getElementById("year").value;
var month = document.getElementById("month").value;
var day = document.getElementById("day").value;
var theDay = document.getElementById("theDay")
  // Make the function , takes user's input , put it in the new Date Object >> Show the user the day...

function checkDate() {
  var date = new date(year, month, day)
  theDay.innerHTML = "You were born on " + date.slice(0, 3);
  return theDay
}

＆＃13;

body {
  margin: 0 auto;
  padding: 0;
  background: lightblue;
  text-align: center;
}
h1 {
  color: white;
  width: 1400px;
  margin-top: 100px;
  line-height: 1.5em;
  font-family: Arial;
}
input.input {
  width: 700px;
  background: lightgrey;
  padding: 10px;
  border-radius: 5px;
  font-size: 20px;
  color: white;
  font-weight: bold;
  margin-top: 10px;
  border: 3px solid black;
}
input.year {
  width: 700px;
  background: lightgrey;
  padding: 10px;
  border-radius: 5px;
  font-size: 20px;
  color: white;
  font-weight: bold;
  margin-top: 200px;
}
button {
  width: 700px;
  background-color: darkgrey;
  color: white;
  padding: 5px;
  font-size: 20px;
}

＆＃13;

 <h1>Your friend was born on Tuesday?<br /> You can also know!! Just complete the form</h1>
<input type="text" placeholder="Write the year .." id="year" class="input">
<br />
<input type="text" placeholder="Write the month.." id="month" class="input">
<br />
<input type="text" placeholder="Write the day.." id="day" class="input">
<br />
<br />
<button onclick="checkDate()">See The Day!!!</button>
<div id="theDay"></div>

＆＃13;

当我尝试运行它时，控制台会显示错误＆gt;＆gt;未捕获的TypeError：无法读取属性＆＃39;值＆＃39;第13行的null>＆gt; （var年）当我删除时，我试图设置默认值，不起作用。在年，月，日的每个变量中的符号+值，它出现了另一个错误，我只是喜欢这种语法，我不想将其改为另一种方式，如果有人有解决方案或者可以告诉我在哪里错误的部分是我非常感激

Answer 1

在浏览器“看到”输入元素之前，您的javascript正在运行 -

将您的代码移至<body>的末尾（正好在</body>之上）;或
将您的代码更改为在DOM“准备就绪”后运行;或
在checkDate函数中移动变量赋值（year = document.getElementById("year").value;等） - 你可以在函数内部或外部声明变量，它并不重要（最好在里面）

最后一个选项可能是首选 -

<script type="text/javascript">
    // Make the function , takes user's input , put it in the new Date Object >> Show the user the day...
        function checkDate(){
        // Declare Variables;
            var year = document.getElementById("year").value;
            var month = document.getElementById("month").value;
            var day = document.getElementById("day").value;
            var theDay = document.getElementById("theDay")
            var date = new date(year,month,day)
            theDay.innerHTML = "You were born on "+ date.slice(0,3);
            return theDay
        }
</script>

Answer 2

使用date.getDay()功能。
月份索引从零开始。
DOM值提取不是一次性的，因此需要在回调中移动。

var theDay = document.getElementById("theDay")
  // Make the function , takes user's input , put it in the new Date Object >> Show the user the day...

var getName = (function() {
  var names = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
  return function(index) {
    return names[index];
  }
})();

function checkDate() {
  // Declare Variables;
  var year = document.getElementById("year").value;
  // months are indexed from 0 in JS.
  var month = document.getElementById("month").value - 1;
  var day = document.getElementById("day").value;

  var date = new Date(year, month, day);
  theDay.innerHTML = "You were born on " + getName(date.getDay());
  return theDay
}

body {
  margin: 0 auto;
  padding: 0;
  background: lightblue;
  text-align: center;
}
h1 {
  color: white;
  width: 500px;
  margin-top: 100px;
  line-height: 1.5em;
  font-family: Arial;
}
input.input {
  width: 700px;
  background: lightgrey;
  padding: 10px;
  border-radius: 5px;
  font-size: 20px;
  color: white;
  font-weight: bold;
  margin-top: 10px;
  border: 3px solid black;
}
input.year {
  width: 300px;
  background: lightgrey;
  padding: 10px;
  border-radius: 5px;
  font-size: 20px;
  color: white;
  font-weight: bold;
  margin-top: 200px;
}
button {
  width: 300px;
  background-color: darkgrey;
  color: white;
  padding: 5px;
  font-size: 20px;
}

<h1>Your friend was born on Tuesday?<br /> You can also know!! Just complete the form</h1>
<input type="text" placeholder="Write the year .." id="year" class="input">
<br />
<input type="text" placeholder="Write the month.." id="month" class="input">
<br />
<input type="text" placeholder="Write the day.." id="day" class="input">
<br />
<br />
<button onclick="checkDate()">See The Day!!!</button>
<div id="theDay"></div>

这个是一个奇怪的错误，我以前没见过，我无法处理

2 个答案: