2011-06-28 18 views
6

Si tiene varios elementos de formulario con el mismo name en un formulario, la entrada en la colección elements en el formulario termina siendo una colección de esos campos (lo cual es útil). La especificación HTML DOM2 covers the elements collection pero no parece indicar este comportamiento de inmediato cuando hay varios campos con el mismo nombre. ¿El comportamiento está cubierto por un estándar (en otro lugar en la especificación HTML DOM2, o en otra especificación)?Elementos de formulario con el mismo nombre reflejado en DOM

Para mayor claridad, no estoy preguntando cuál es la mejor forma de acceder a estos campos. Pregunto si el hecho de que terminan en una colección (de diversos tipos) en la colección elements está cubierto por un estándar, y si es así, cuál.

Ejemplo (live copy):

HTML:

<form id="theForm"> 
<input type="text" name="foo" value="one"> 
<input type="text" name="foo" value="two"> 
</form> 

JavaScript:

var form = document.getElementById("theForm"), 
    foo = form.elements.foo, 
    index; 
console.log("typeof foo = " + typeof foo); 
if (typeof foo !== "undefined") { 
    console.log("Object#toString says: " + Object.prototype.toString.call(foo)); 
} 
if ('length' in foo && 'item' in foo) { 
    console.log("Looks like a collection of some kind:"); 
    for (index = 0; index < foo.length; ++index) { 
    console.log(index + ": " + foo[index].value); 
    } 
} 

Ejemplo de salida (para Chrome):

typeof foo = object 
Object#toString says: [object NodeList] 
Looks like a collection of some kind: 
0: one 
1: two

He comprobado IE6 , 7, 8, una d 9, Firefox 4.0, Firefox 3.6, Chrome 12, Opera 11 y Safari 5. Todos hacen que la entrada en elements sea una colección de algún tipo (Chrome, Firefox y Safari lo convierten en NodeList [aunque extrañamente en Safari el typeof es "función" no "objeto"], e IE y Opera lo convierten en HTMLCollection, pero todos tienen length, item y [] acceso). Solo estoy tratando de encontrar el estándar, si hay alguno, que especifique el comportamiento.

+0

¿Por qué no utilizar document.getElementsByName ("fieldNAME") que devuelve una matriz en todos los navegadores – mplungjan

+1

@mplungjan: @ T.J. solo quiere saber si este comportamiento está definido en alguna parte. –

+0

@mplungjan: Citando: * "No estoy preguntando cuál es la mejor manera de acceder a estos campos. Estoy preguntando si el hecho de que terminan en una colección (de diversos tipos) en la colección' elements' está cubierto por un estándar y, de ser así, cuál. "* Sé que puedo usar' getElementsByName' (aunque me dará ** todos ** los elementos con ese nombre, no solo los que están en el formulario). El objetivo de la pregunta es estándares. –

Respuesta

2

Está cubierto por el borrador de especificaciones HTML5 (y el WH AT-WG versión), que en este caso parece más sobre documentar la forma en que siempre ha trabajado, en la sección sobre HTMLFormControlsCollection (W3C ref, WHAT-WG ref):

Si hay varios elementos que coinciden, a continuación, un [HTMLFormControlsCollection (W3C ref, WHAT-WG ref) se devuelve el objeto que contiene todos esos elementos.

+0

¡Gracias! Actualicé la respuesta para vincularla a las especificaciones de HTML5 en el W3C, porque definitivamente es un cuerpo de especificación (no me inicie en la política sobre la relación WHAT-WG/W3C). Nombre extraño para él (estos pueden no ser botones de radio), pero bueno. Eso específicamente se relaciona con la función 'namedItem', pero gracias a la [sección de mapeo ECMAScript de la especificación HTML DOM2] (http://www.w3.org/TR/2003/REC-DOM-Level-2-HTML-20030109/DOM2 -HTML.html # ecma-script-binding) sabemos que [] lo usa. –

+0

El acceso '[]' en la especificación HTML es en realidad de la [especificación WebIDL] (http://dev.w3.org/2006/webapi/WebIDL/). La función 'namedItem' es una [operación especial] (http://dev.w3.org/2006/webapi/WebIDL/#dfn-special-operation) llamada un _ getter_. – Carey

+0

I * sabía * que tenía que haber algo que surgiera de las especificaciones de HTML de DOM2, en mi lista de referencias era "hmmm, ¿dónde hay una versión más reciente de esto?" uno. Excelente, gracias. WebIDL ahora está en mi lista de referencias. –

0

Parece que hay una diferencia entre las formas de acceso y el acceso DOM en Firefox 4.0.1 y 5

http://jsfiddle.net/mplungjan/jMnWP/

form.foo:

typeof formFoo = object 
Object#toString says: [object NodeList] 
Looks like a collection of some kind: 
0: one 
1: two 

document.getElementsByName ("foo") :

typeof docFoo = object 
Object#toString says: [object HTMLCollection] 
Looks like a collection of some kind: 
0: one 
1: two 
+0

No en Chrome ... –

+0

¡Interesante! (Firefox 3.6, también.) Opera hace lo mismo, pero al revés ('formFoo' es un' HTMLCollection', pero 'docFoo' es un' NodeList'). (Por cierto, esto fue más un * comentario * que una * respuesta *.) –

+0

Lo publiqué como respuesta ya que puedo formatear las respuestas. Puedo borrarlo si sientes que no tiene ningún valor – mplungjan

Cuestiones relacionadas