在 JavaScript 中按类型访问元素

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

Now I was trying to make something like this but obtain all elements by a certain type, for example all elements type="text"

有没有什么方法可以在 JavaScript 中实现这一点,或者我应该使用 jQuery?

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

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

Sizzle 选择器引擎(驱动 JQuery 的引擎)已经为此做好了完美的准备:

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

或者

var elements = $('input:text');

If you are lucky and need to care only for recent browsers, you can use:

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

“近期”指的不是 IE6和 IE7

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