Javascript 在新行（html）中动态添加更多文本字段_Javascript_Html_Dom

Javascript 在新行（html）中动态添加更多文本字段

javascript html dom

Javascript 在新行（html）中动态添加更多文本字段,javascript,html,dom,Javascript,Html,Dom,我使用了html javascript/中的代码。我的代码如下： <HTML> <HEAD> <TITLE>Dynamically add Textbox, Radio, Button in html Form using JavaScript</TITLE> <SCRIPT language="javascript"> function add() { for (i=1; i<=5; i++) {

我使用了html javascript/中的代码。我的代码如下：

<HTML>
<HEAD>
<TITLE>Dynamically add Textbox, Radio, Button in html Form using JavaScript</TITLE>
<SCRIPT language="javascript">
function add() {

    for (i=1; i<=5; i++)
      {
        //Create an input type dynamically.
        var element = document.createElement("input");
     
        //Assign different attributes to the element.
        element.setAttribute("type", i);
        element.setAttribute("name", i);
        element.setAttribute("value", i);
     
     
        var foo = document.getElementById("fooBar");
     
        //Append the element in page (in span).
        foo.appendChild(element);
      }

 
}
</SCRIPT>
</HEAD>
<BODY>
<FORM>
<H2>Dynamically add element in form.</H2>
Select the element and hit Add to add it in form.
<BR/>
<INPUT type="button" value="Add" onclick="add()"/>
     
<span id="fooBar">&nbsp;</span>
     
</FORM>
</BODY>
</HTML>


使用JavaScript以html形式动态添加文本框、单选框和按钮
函数add（）{
对于（i=1；i，您可以更改输入的显示样式
function add() {

    for (i=1; i<=5; i++)
      {
        //Create an input type dynamically.
        var element = document.createElement("input");

        //Assign different attributes to the element.
        element.setAttribute("type", i);
        element.setAttribute("name", i);
        element.setAttribute("value", i);
        element.style.display = "block";

        var foo = document.getElementById("fooBar");

        //Append the element in page (in span).
        foo.appendChild(element);
      }
}

函数添加（）{
对于（i=1；i为什么不这样做
var br = document.createElement("br");
foo.appendChild(br);

您可以尝试在输入元素之后添加新的br元素
  for (i=1; i<=5; i++)
  {
    //Create an input type dynamically.
    var element = document.createElement("input");

    //Assign different attributes to the element.
    element.setAttribute("type", i);
    element.setAttribute("name", i);
    element.setAttribute("value", i);

    var brElement = document.createElement("br");

    var foo = document.getElementById("fooBar");

    //Append the element in page (in span).
    foo.appendChild(element);
    foo.appendChild(brElement );
  }

for（i=1；i您只需将其添加到css中即可
input{display:block;}