web-dev-qa-db-fra.com

Accéder aux éléments par type en javascript

Il y a quelque temps, je faisais un test en Javascript, et jouais avec un code pour obtenir le texte de tous les éléments avec une certaine classe, maintenant j'essayais de faire quelque chose comme ça mais d'obtenir tous les éléments par un certain type, par exemple tous les éléments type = "text" Existe-t-il un moyen de le faire en Javascript ou dois-je utiliser jquery?

var xx = document.getElementsByClassName("class");
for (i=0;i<xx.length;i++){
    var str=xx[i].innerHTML;
            alert(str);
}
36
Saikios

En JavaScript ancien, vous pouvez le faire:

var inputs = document.getElementsByTagName('input');

for(var i = 0; i < inputs.length; i++) {
    if(inputs[i].type.toLowerCase() == 'text') {
        alert(inputs[i].value);
    }
}

Dans jQuery, vous ne feriez que:

// select all inputs of type 'text' on the page
$("input:text")

// hide all text inputs which are descendants of div class="foo"
$("div.foo input:text").hide();
57
karim79

Si vous avez de la chance et ne devez vous soucier que des navigateurs récents, vous pouvez utiliser:

document.querySelectorAll('input[type=text]')

"récent" signifie pas IE6 et IE7

56
Mic
var inputs = document.querySelectorAll("input[type=text]") ||
(function() {
    var ret=[], elems = document.getElementsByTagName('input'), i=0,l=elems.length;
    for (;i<l;i++) {
        if (elems[i].type.toLowerCase() === "text") {
            ret.Push(elems[i]);
        }
    }

    return ret;
}());
3
zvona

Le moteur de sélection Sizzle (qui alimente JQuery) est parfaitement adapté à cela:

var elements = $('input[type=text]');

Ou

var elements = $('input:text');
2
Matthew Abbott