如何在 JavaScript 中创建新行？

Question

I have appended a textbox to a div area. However I want it to goto a new line in that div after it does that, so my for loop prints a column of textboxes instead of a row.

I tried this:

<div id="timearea"> </div>
var br = '<br/>';
br.appendTo("#timearea");

However this does not work. What would the code be?

Answer 1

You would need to create the element using the createElement() method then append the child to the element using the appendChild() method

var br = document.createElement("br");
document.getElementById("timearea").appendChild(br);

Answer 2

I suggest you apply CSS styling to your divs to control how they are laid out. You can add attributes to style inline or (preferably) add classes to assign styles via JavaScript.

The display attribute controls the flow - display:block should do it.

.my_block_class {
  display:block;
}

You can then add the class with JavaScript like so :

document.getElementById("timearea").className += "my_block_class";

Or, if you want to do it without classes:

document.getElementById("timearea").style.display = "block";

Answer 3

Not sure if you mean textarea or input type="text" but regardless, it is better to do this in CSS. In your CSS file or inline style description add:

#timearea input {
  display:block;
}

If it's an input element you are adding, or:

#timearea textarea {
  display:block;
}

If it's a textarea .