JavaScript de ejemplo
<html> <body> <form id="test"></form> </body> </html> let input_el = document.createElement('input'); input_el.setAttribute('type','text'); input_el.setAttribute('name','your_name'); let my_form = document.getElementById('test'); my_form.prepend(input_el);Produce el siguiente resultado en las herramientas de desarrollo de Chrome en Windows (versión de Chrome 96.0.4664.45):
Y no la forma correcta:
<input type="text" name="your_name">También vea este violín: https://jsfiddle.net/m1fqzLv6/
Por ahora no encontré ninguna función de javascript que permitiera esto.
Esta pregunta se basa en la suposición de que document.createElement() produciría código HTML. Esto es incorrecto.
En realidad, el código HTML se analiza en un modelo de objeto de documento (DOM). JavaScript puede modificar posteriormente el DOM (ver también los comentarios de TJ Crowder arriba). En su ejemplo, se agrega un elemento <input> .
Chrome, en su herramienta para desarrolladores, representa el DOM por código HTML que la mayoría de los desarrolladores pueden leer fácilmente. Y si hay un elemento <input> en el DOM, el panel de herramientas de desarrollo tiene que decidir cómo representarlo. Aparentemente, elige la forma larga con <input></input> . Esto, sin embargo, es sólo una decisión de salida.