web-dev-qa-db-ja.com

JavaScriptのタイプによる要素へのアクセス

しばらく前、私はJavascriptでテストを行い、特定のクラスのすべての要素のテキストを取得するコードで遊んでいたが、今はこのようなものを作ろうとしていたが、特定のタイプ、たとえばすべての要素type = "text" Javascriptでこれを行う方法はありますか、jqueryを使用する必要がありますか?

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

昔ながらのJavaScriptでは、これを行うことができます。

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

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

JQueryでは、次のようにします。

// 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

幸運で最近のブラウザのみを気にする必要がある場合は、次を使用できます。

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

「最近」はIE6および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

シズルセレクターエンジン(JQueryの原動力)は、これに最適です。

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

または

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