javascript - ejemplos - innerhtml value

¿Es normal que las entradas de imagen se omitan del DOM en document.forms[x].elements?

Question

He encontrado que dado un formulario en una página HTML como este:

<form name="form">
   <input type="image" name="foo" 
          src="somewhere.gif" alt="image" value="blah"/>
   <input type="text" name="bar" value="blah"/>
</form>

Al acceder a los elementos a través del DOM en Javascript, ¡no hay ningún elemento para la entrada de imágenes! Simplemente se omite. Entonces, document.forms[0].elements.length es 1, y document.forms[0].element[0].type es "text".

Este parece ser el caso en Firefox e IE. No puedo encontrar este hecho documentado en ninguna parte de mis libros de referencia o en la web. Todo lo que puedo encontrar es un comentario desechable aquí:

https://bugzilla.mozilla.org/show_bug.cgi?id=163822#c4

Lo que sugiere que "simplemente es así". Si es así, bien, que así sea, ¿pero en realidad no está documentado en ninguna parte? ¿Es un error histórico o hay una razón para ello?

Answer 1

De hecho, veo un comentario: " Se supone que el DOM funciona de esa manera, así es como funciona en Mozilla, NS4x e IE. No podemos cambiar eso aunque quisiéramos, muchos sitios se romperían " . se inclinaría hacia un error histórico. El elemento de imagen ya está en HTML 2 DTD ...

Tal vez sea por eso y por otros posibles culpables que los autores desalientan el uso de la jerarquía Dom de esa manera en favor de las funciones getElement [s] ByXxx (¡o XPath!).

Answer 2

Interesante ... la especificación DOM 1 define .elements como:

elementos Devuelve una colección de todos los elementos de control en el formulario.

La parte de especificación de HTML 4 17.2.1 no enumera los tipos de "imagen", así que supongo que esa es la respuesta.

Answer 3

Parece que ese es el comportamiento de la propiedad de elements en todos los navegadores.

Sin embargo, aún debería poder acceder a él a través del DOM en JavaScript utilizando la propiedad childNodes .

Para tu ejemplo:

document.forms[0].childNodes.length; // equals 5 (2 inputs and 3 text nodes).
document.forms[0].childNodes[1];     // This is your input with type=''image''

Answer 4

Me ha mordido yo mismo. Se indica en los documentos DHTML DHTML .