当用JavaScript制作HTML表单时，新行不工作

New Line Not Working When Making HTML Form with JavaScript

本文关键字：新行不 工作 表单 JavaScript 制作 HTML 当用      更新时间：2023-09-26

我使用以下代码使用JavaScript制作html5表单。

newLine = document.createElement("br");
var optionsForm = document.createElement("form");
optionsForm.setAttribute('method',"post");
optionsForm.setAttribute('action',"submit.php");
var selectColor = document.createElement("select"); //input element, drop-down
selectColor.setAttribute('type',"select");
selectColor.setAttribute('name',"colorMenu");
selectColor.setAttribute('id',"colorMenuID");
// Populate drop-down menu
var option = document.createElement("option");
option.text = "Select Color:";
option.value = "selectColor";
selectColor.appendChild(option);
optionsForm.appendChild(selectColor);
optionsForm.appendChild(newLine);

但是，当我创建新的下拉菜单时，它与旧的下拉菜单在同一行。附加newLine元素似乎没有任何效果。

我知道怎么做了。

var menuElement = document.createElement("div");
label = document.createTextNode("Label: ");
menuElement .appendChild(label);
var selectMenu = document.createElement("select"); 
selectMenu.setAttribute('type',"select");
selectMenu.setAttribute('name',"menuName");
selectMenu.setAttribute('id',"menuID");
menuElement.appendChild(selectMenu);

然后我添加一些选项，然后

menuElement.appendChild(newLine);
optionsForm.appendChild(menuElement);
相关文章：