HTML Insertion Mode
When the browser encounters your html, it starts building the DOM tree. There are rules on how the tree is to be built, this depends on the built-in tags, what happens when the a certain element is placed in a certain place, how should the tree be built. All these rules are properly defined in the specification. The insertion mode is a state variable that controls the primary operation of the tree construction stage.
http://dev.w3.org/html5/spec-preview/parsing.html#insertion-mode
Let’s look into the code. The input element is placed inside a select tag, in this case, the specification says “act as if an end tag with the tag name ‘select’ had been seen, and reprocess the token”.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>HTML5 Insertion Mode</title> </head> <body> <select name="" id=""> <option value="1">1</option> <input type="text" value="rushi" /> <option value="2">2</option> </select> </body> </html> |
“Keep learning.”
-Rushi
-Rushi