Obtener una lista de todos los objetos de entrada usando JavaScript, sin tener que acceder a un objeto de formulario

Question

Necesito obtener todos los objetos input y manipular el parámetro onclick.

Lo siguiente hace el trabajo para los enlaces <a>. Buscando algo así para input etiquetas.

for (var ls = document.links, numLinks = ls.length, i=0; i<numLinks; i++){ 
    var link = unescape(ls[i].href); 
    link = link.replace(/\\'/ig,"#"); 
    if(ls[i].href.indexOf("javascript:") == -1) 
    { 
    ls[i].href = "javascript:LoadExtern(\\""+link+"\\",\\"ControlPanelContent\\",true,true);"; 
    } 
} 

Answer 1

(véase la actualización al final de la respuesta.)

se puede obtener una NodeList de todos los input elementos a través de getElementsByTagName (DOM specification, MDC, MSDN), entonces simplemente recorrer es:

var inputs, index; 

inputs = document.getElementsByTagName('input'); 
for (index = 0; index < inputs.length; ++index) { 
    // deal with inputs[index] element. 
} 

No tengo lo usé en el document, que buscará todo el documento. También existe en elementos individuales (DOM specification), que le permite buscar sólo sus descendientes en lugar de todo el documento, por ejemplo:

var container, inputs, index; 

// Get the container element 
container = document.getElementById('container'); 

// Find its child `input` elements 
inputs = container.getElementsByTagName('input'); 
for (index = 0; index < inputs.length; ++index) { 
    // deal with inputs[index] element. 
} 

... pero usted ha dicho que no desea utilizar la matriz form , por lo que el primer ejemplo es más aplicable a su pregunta (el segundo está allí para completar, en caso de que alguien más encuentre esta respuesta).

---

actualización: getElementsByTagName es una manera absolutamente bien para hacer lo anterior, pero lo que si quieres hacer algo un poco más complicado, como acaba de encontrar todas las casillas de verificación en lugar de todos los elementos de input?

Aquí es donde entra el útil querySelectorAll: nos permite obtener una lista de elementos que coincidan con con cualquier selector de CSS que desee. Por lo tanto, para nuestras casillas de verificación ejemplo:

var checkboxes = document.querySelectorAll("input[type=checkbox]"); 

También puede usarlo en el nivel del elemento. Por ejemplo, si tenemos un elemento div en nuestra variable element, podemos encontrar todos los span s con la clase foo que están dentro de esa div así:

var fooSpans = element.querySelectorAll("span.foo"); 

querySelectorAll y su primo querySelector (que solo se encuentra el primer elemento coincidente en lugar de darle una lista) son compatibles con todos los navegadores modernos, y también con IE8.

Answer 2

var inputs = document.getElementsByTagName('input'); 
for (var i = 0; i < inputs.length; ++i) { 
    // ... 
}