html 頁面中的下拉菜單未正確顯示

Question

我需要顯示一個輸入和一個下拉列表。 但是由於某種原因，輸入出現在頁面上，但下拉菜單顯示不正確。 這是下面的代碼

這是下面的屏幕截圖

正如你所看到的，輸入看起來很好，但不是下拉。 問題是什么？

 let card = "" card += "<div class='container'>" card += "<div class='row'>" card += "<input type='text'" card += '<select> <option value="time">A</option> <option value="place">B</option> <option value="fee">Fee</option></select>' card += "</div>" card += "</div>" document.querySelector('#app').innerHTML = card

 <div id="app"> </div>

Answer 1

改變這個：

card += "<input type='text'"

對此：

card += "<input type='text'>"

Answer 2

 let card = "" card += "<div class='container'>" card += "<div class='row'>" card += "<input type='text'>" card += '<select> <option value="time">A</option> <option value="place">B</option> <option value="fee">Fee</option></select>' card += "</div>" card += "</div>" document.querySelector('#app').innerHTML = card

 <div id="app"> </div>

粘貼上面的 javascript 代碼。 如上所述，問題在於您沒有關閉輸入標簽，因此在它之后編寫的所有內容都被認為是在同一個標簽內。

Answer 3

是的，標簽沒有正確關閉。 對於 html，關閉輸入標簽，如<input type="text">對於 xhtml，關閉輸入標簽，如<input type="text"/>