Why is the input tag in HTML
<input value="something"/>
instead of
<input>something</input>
Or why is the p tag not
<p value="something"/>
instead of
<p>something</p>
Why is the input tag in HTML
<input value="something"/>
instead of
<input>something</input>
Or why is the p tag not
<p value="something"/>
instead of
<p>something</p>
It is just how it was designed. For some reason a decision was made to use an attribute to store the value. I figure it is also advantages when it comes to trailing and leading whitespace - easier in the attribute. The standard with tags is to ignore white space, which is not desirable in an input field where you want to capture all the text. Another issue with the tag would be start and end tags over multiple lines.
Those two tags are trying to do fundamentally different things with their "value".
A p
tag is a means of separating a block of text. It, and other "closing tags" (i.e. tags that have a </tag>
, like p
), are telling the parser that this text means something. Bearing that in mind, the format makes sense: the parser sees a <p>
tags, and knows that "everything from here until I see a </p>
tag is semantically a paragraph; act appropriately."
An input
tag, however, isn't trying to apply meaning to any text; the tag is the meaning. From the parser's perspective, seeing an <input />
tag tells it to "replace this with a form element." This is the fundamental behaviour of self-closing tags: they don't add meaning to text, they add content (Of one form or another) to the entire document. So having a closing tag for input
doesn't make sense; the input
doesn't provide extra meaning to any text, instead the text says something meaningful about the input
element. Hence, it's an attribute.
The <input/>
tag is been used instead of writing it's open/close tag because of what the tag actually does.
An input tag is not expected to occupy any child element, so you needing to write more?
Unlike the <div>
<span>
and <table>
tags which can still contain more child elements,compare to <input>
tag which is a stand alone element, which does not need that for any reason.
In other way, browsers also support writing it this way:
<input type="text"></input>
These types of tags are called standalone tags that don't wrap contents between the opening and closing tags. eg In <h1>East</h1>
We have two tags. In standalone tags the contents are bundled as the value of the value attribute inside the opening tag. For example <input type="submit" value="Send" />
and the break <br />
tags.