Obtenir la liste de tous les objets `input` utilisant JavaScript, sans accéder à un objet` form`

Je dois obtenir tous les objets d'entrée et manipuler le paramètre onclick.

Ce qui suit concerne le travail pour les liens. À la recherche d'une telle chose pour les tags de saisie.

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);"; } } 

(Voir la mise à jour à la fin de la réponse.)

Vous pouvez obtenir un NodeList de tous les éléments d' input via getElementsByTagName ( Spécification DOM , MDC , MSDN ), puis faites-le NodeList travers:

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

Là, je l'ai utilisé sur le document , qui va chercher tout le document. Il existe également sur des éléments individuels ( spécification DOM ), vous permettant de rechercher uniquement leurs descendants plutôt que le document entier, par exemple:

 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. } 

… mais vous avez dit que vous ne voulez pas utiliser le form parent, donc le premier exemple est plus applicable à votre question (la seconde est juste pour l'exhaustivité, au cas où quelqu'un d'autre trouverait cette réponse à connaître).


Mise à jour : getElementsByTagName est une manière absolument correcte de faire ce qui précède, mais que faire si vous voulez faire quelque chose de légèrement plus compliqué, comme tout simplement trouver toutes les cases à cocher au lieu de tous les éléments d' input ?

C'est là que la querySelectorAll vient: Cela nous permet d'obtenir une liste d'éléments qui correspondent à n'importe quel sélecteur CSS que nous voulons . Donc, pour notre case à cocher exemple:

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

Vous pouvez également l'utiliser au niveau de l'élément. Par exemple, si nous avons un élément div dans notre variable d' element , nous pouvons trouver tous les span s avec la classe foo qui sont à l'intérieur de cette div comme ceci:

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

querySelectorAll et son cousin querySelector (qui trouve simplement le premier élément correspondant au lieu de vous donner une liste) sont pris en charge par tous les navigateurs modernes, et IE8.

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