Closing HTML <input> tag issue

Question

Why don't the HTML <input> tags get a closing tag like other HTML tags and what would go wrong if we do close the input tag?

I tried to Google and I found the standard to write a input tag like this <input type="text" name="name"> not closing it with a </input>.

I personally felt the problem when I created an input tag for Radio buttons using

var DOM_tag = document.createElement("input");

This though created a radio button, but the TextNode I appended to the radio button with

document.createTextNode("Radio Label");

does not work. It simply shows the radio button with no Radio Label as in this case.

Though I can see the complete code:

<input id="my_id" type="radio" name="radio_name">Radio Label</input>

What is explanation?

P.S.

The main problem that occurred to me is the automatically closing of input tag as I mentioned in the question as I am using var DOM_tag = document.createElement("input"); which automatically creates a closing tag. What should I do about that?

Answer 1

These are void elements. This means they aren't designed to contain text or other elements, and as such do not need — and in fact, cannot have — a closing tag in HTML.¹

However, they can have a <label> associated with them:

<input id="my_id" type="radio" name="radio_name">
<label for="my_id">Radio Label</label>

Radio buttons by nature can't contain text anyway, so it wouldn't make sense for them to accept text or other elements as content. Another issue with a control that does accept text as input: should its textual content then be its value, or its label? To avoid ambiguity we have a <label> element that does exactly what it says on the tin, and we have a value attribute for denoting an input control's value.

---

¹ _{XHTML is different; by XML rules, every tag must be opened and closed; this is done with the shortcut syntax instead of a </input> tag, although the latter is equally acceptable:}

<input id="my_id" type="radio" name="radio_name" />
<label for="my_id">Radio Label</label>