從時間比較的選擇字段中刪除選項

Question

我試圖從基於時間比較的選擇字段中刪除時間選項，由於某些原因，只有其他選項被刪除。 17:00:00之後的所有內容都是正確的。

我錯過了什麼？

我的時間選擇：

<select id="mytimes">   
    <option value="14:00:00">2:00 PM</option> 
    <option value="14:15:00">2:15 PM</option> 
    <option value="14:30:00">2:30 PM</option> 
    <option value="14:45:00">2:45 PM</option> 
    <option value="15:00:00">3:00 PM</option> 
    <option value="15:15:00">3:15 PM</option> 
    <option value="15:30:00">3:30 PM</option> 
    <option value="15:45:00">3:45 PM</option> 
    <option value="16:00:00">4:00 PM</option> 
    <option value="16:15:00">4:15 PM</option> 
    <option value="16:30:00">4:30 PM</option> 
    <option value="16:45:00">4:45 PM</option> 
    <option value="17:00:00">5:00 PM</option> 
    <option value="17:15:00">5:15 PM</option> 
    <option value="17:30:00">5:30 PM</option> 
    <option value="17:45:00">5:45 PM</option> 
    <option value="18:00:00">6:00 PM</option> 
    <option value="18:15:00">6:15 PM</option> 
    <option value="18:30:00">6:30 PM</option> 
    <option value="18:45:00">6:45 PM</option> 
    <option value="19:00:00">7:00 PM</option> 
    <option value="19:15:00">7:15 PM</option> 
    <option value="19:30:00">7:30 PM</option> 
    <option value="19:45:00">7:45 PM</option> 
    <option value="20:00:00">8:00 PM</option> 
    </select> 

我的javascript：

var t = document.getElementById('mytimes'); 
var t2 = "17:00:00"; 
for (var i = 0; i < t.length; i++) { 
    if (t[i].value < t2) { 
    t[i].remove(); 
    } 
} 

我的結果

<option value="14:15:00">2:15 PM</option> 
<option value="14:45:00">2:45 PM</option> 
<option value="15:15:00">3:15 PM</option> 
<option value="15:45:00">3:45 PM</option> 
<option value="16:15:00">4:15 PM</option> 
<option value="16:45:00">4:45 PM</option> 
<option value="17:00:00">5:00 PM</option> 
<option value="17:15:00">5:15 PM</option> 
<option value="17:30:00">5:30 PM</option> 
<option value="17:45:00">5:45 PM</option> 
<option value="18:00:00">6:00 PM</option> 
<option value="18:15:00">6:15 PM</option> 
<option value="18:30:00">6:30 PM</option> 
<option value="18:45:00">6:45 PM</option> 
<option value="19:00:00">7:00 PM</option> 
<option value="19:15:00">7:15 PM</option> 
<option value="19:30:00">7:30 PM</option> 
<option value="19:45:00">7:45 PM</option> 
<option value="20:00:00">8:00 PM</option> 

Answer 1

你可以使用.childNodes選擇.childNodes的#mytimes，.parentElementoption選擇select元件，.removeChild()除去option元件，其中value小於17:00:00

<select id="mytimes"> 
 
    <option value="14:00:00">2:00 PM</option> 
 
    <option value="14:15:00">2:15 PM</option> 
 
    <option value="14:30:00">2:30 PM</option> 
 
    <option value="14:45:00">2:45 PM</option> 
 
    <option value="15:00:00">3:00 PM</option> 
 
    <option value="15:15:00">3:15 PM</option> 
 
    <option value="15:30:00">3:30 PM</option> 
 
    <option value="15:45:00">3:45 PM</option> 
 
    <option value="16:00:00">4:00 PM</option> 
 
    <option value="16:15:00">4:15 PM</option> 
 
    <option value="16:30:00">4:30 PM</option> 
 
    <option value="16:45:00">4:45 PM</option> 
 
    <option value="17:00:00">5:00 PM</option> 
 
    <option value="17:15:00">5:15 PM</option> 
 
    <option value="17:30:00">5:30 PM</option> 
 
    <option value="17:45:00">5:45 PM</option> 
 
    <option value="18:00:00">6:00 PM</option> 
 
    <option value="18:15:00">6:15 PM</option> 
 
    <option value="18:30:00">6:30 PM</option> 
 
    <option value="18:45:00">6:45 PM</option> 
 
    <option value="19:00:00">7:00 PM</option> 
 
    <option value="19:15:00">7:15 PM</option> 
 
    <option value="19:30:00">7:30 PM</option> 
 
    <option value="19:45:00">7:45 PM</option> 
 
    <option value="20:00:00">8:00 PM</option> 
 
</select> 
 
<script> 
 
    var t = document.getElementById("mytimes").childNodes; 
 
    var t2 = "17:00:00"; 
 
    for (var i = 0; i < t.length; i++) {   
 
    if (t[i].tagName === "OPTION" && t[i].value < t2) { 
 
     t[i].parentElement.removeChild(t[i]); 
 
    } 
 
    } 
 
</script>