new Date(time)返回 null，您正在尝试使用getHours()。您可以拆分time value 并使用[0]index 获取数组的第一个元素以获取小时数。

代码示例：

function showTime(){
  let time = document.getElementById('myTime');
  let output = document.getElementById('output');
  let getHours = time.value.split(":")[0];
  console.log(getHours);
  getHours < 12 ? output.innerText = 'Morning'
  : getHours < 18 ? output.innerText = 'Afternoon'
  : getHours < 24 ? output.innerText = 'Evening'
  : output.innerText = 'Error getting hour!';
}

span{
  border: 1px solid gray;
  background-color: gray;
  color: darkred;
  width: 12rem;
  height: 12rem;
}

<label>Time In: </label><input id='myTime' type='time'/>
<br><br>
<button onclick="showTime()">Show Hour Only</button>
<br><br>
<span id='output'></span>

格式不对，你需要年，月和秒。

function showTime() {
  let time = document.getElementById('myTime').value;
  let output = document.getElementById('output');
  let now = new Date()
  let getHours = new Date(`${now.getFullYear()}-${now.getMonth()}-${now.getDate()} ${time}:00`).getHours();
  output.innerText = getHours < 12 ? 'Morning' : getHours < 18 ? 'Afternoon' : getHours < 24 ? 'Evening' : 'Error getting hour!'
}

<label>Time In: </label><input id='myTime' type='time' />
<br><br>
<button onclick="showTime()">Show Hour Only</button>
<br><br>
<span id='output'></span>

你应该使用time.value，但输入值只是时间组件，而不是完整的日期，这样你就无法实现所需的输出。这是你想要的工作代码。
从时间中只提取小时部分，然后检查它是否有效，然后输出它。

function showTime() {
  let time = document.getElementById('myTime');
  let output = document.getElementById('output');
  let hours = parseInt(time.value.substr(0, 2)); 
  console.log(hours);
  if (!isNaN(hours)) {
    output.innerText = hours < 12 ? 'Morning' :
      hours < 18 ? 'Afternoon' :
      hours < 24 ? 'Evening' :
      'Error getting hour!';
  } else {
    output.innerText = 'Invalid input';
  }
}

span {
  border: 1px solid gray;
  background-color: gray;
  color: darkred;
  width: 12rem;
  height: 12rem;
}

<label>Time In: </label><input id='myTime' type='time' />
<br><br>
<button onclick="showTime()">Show Hour Only</button>
<br><br>
<span id='output'></span>

编辑js的第4行为：

let getHours = new Date('1/1/1 '+ time.value).getHours()

一定会成功的

function showTime(){
  let time = document.getElementById('myTime');
  let output = document.getElementById('output');
  let getHours = new Date('1/1/1 '+ time.value).getHours()
  console.log(getHours)
  getHours < 12 ? output.innerText = 'Morning'
  : getHours < 18 ? output.innerText = 'Afternoon'
  : getHours < 24 ? output.innerText = 'Evening'
  : output.innerText = 'Error getting hour!';

}

span{
  border: 1px solid gray;
  background-color: gray;
  color: darkred;
  width: 12rem;
  height: 12rem;
}

<label>Time In: </label><input id='myTime' type='time'/>
<br><br>
<button onclick="showTime()">Show Hour Only</button>
<br><br>
<span id='output'></span>