Ottieni l'elenco di tutti gli oggetti di input che utilizzano JavaScript, senza accedere a un oggetto modulo

Question

Ho bisogno di ottenere tutti gli oggetti input e modificare il parametro onclick.

Quanto segue fa il lavoro per i collegamenti <a>. Alla ricerca di qualcosa di simile per i tag input.

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

(Vedi aggiornamento alla fine della risposta.)

è possibile ottenere un NodeList di tutti gli input elementi tramite getElementsByTagName (DOM specification, MDC, MSDN), ciclo poi semplicemente attraverso it:

var inputs, index; 

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

Là ho usato su document, che cercherà l'intero documento. Esiste anche su elementi singoli (DOM specification), che consente di cercare solo i loro discendenti, piuttosto che l'intero documento, ad esempio:

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

... ma tu hai detto che non vuoi usare il genitore form , quindi il primo esempio è più applicabile alla tua domanda (il secondo è solo lì per completezza, nel caso in cui qualcun altro che trova questa risposta abbia bisogno di sapere).

---

Aggiornamento: getElementsByTagName è un modo assolutamente bene per fare quanto sopra, ma cosa succede se si vuole fare qualcosa di un po 'più complicato, come solo trovare tutte le caselle al posto di tutti gli elementi input?

Ecco dove arriva l'utile querySelectorAll: ci consente di ottenere un elenco di elementi che corrispondono a qualsiasi selettore CSS che vogliamo. Così, per il nostro esempio caselle di controllo:

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

È anche possibile utilizzare a livello di elemento. Per esempio, se abbiamo un elemento div nella nostra variabile element, siamo in grado di trovare tutte le span s con la classe foo che si trovano all'interno che div come questo:

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

querySelectorAll e il suo cugino querySelector (che ha appena trova il primo elemento corrispondente invece di darti una lista) sono supportati da tutti i browser moderni, e anche IE8.

Answer 2

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