在 JavaScript 中按类型访问元素

Accessing elements by type in JavaScript

本文关键字:访问 元素 类型 JavaScript      更新时间:2023-09-26

不久前,我正在用JavaScript做一些测试,并玩了一个代码来获取具有某个类的所有元素的文本。

现在我试图制作这样的东西,但通过某种类型获取所有元素,例如所有元素type="text"

有没有办法在JavaScript中做到这一点,或者我应该使用jQuery?

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

如果你很幸运,只需要关心最近的浏览器,你可以使用:

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

"最近"表示不是 IE6 和 IE7

在普通的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();

嘶声选择器引擎(为 JQuery 提供动力)为此做好了完美的准备:

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

var elements = $('input:text');
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;
}());