不使用jQuery，我如何按类型获取输入？

Question

我知道我可以致电：

document.getElementsByTagName("input");

我是否需要遍历并检查type ==“text”的属性？

我知道jQuery有input[type="text"]。 是否有任何简单的JavaScript方法来实现这一目标？

Answer 1

除非代码在a browser which supports querySelectorAll中运行，否则你已经完全正确了。这是跨浏览器代码：

var textInputs;
if (document.querySelectorAll)
{
    textInputs = document.querySelectorAll('input[type=text]');
}
else
{
    textInputs = [];
    var unfiltered = document.getElementsByTagName("input"),
        i = unfiltered.length,
        input;
    while(i--)
    {
        input = unfiltered[i];
        if (!input.type || input.type === 'text')
        {
            textInputs.push(input);
        }
    }
}

else案例中的

N.B。，如果输入如下，我会检查input.type的真实性：

<input />

在这种情况下，默认 type="text"。我仅包括此内容，因为我不能100％确定每个浏览器在关闭属性时是否会返回"text"。至于记录，至少Chrome确实如此。 http://jsfiddle.net/mattball/jJsjn/

Answer 2

这是你可以做到的：）

var elements = document.getElementsByTagName('input')
for(var e in elements)
{
    if(e.type == "text")
    {
    }
}

Answer 3

如果您可以使用，则可以使用Selectors API。

Answer 4

它实际上是特定于sizzlejs而不是jquery本身。是的，放弃jquery是好的。 DOM0集合将以最佳方式执行此任务：

for ( var i = 0; i < document.forms.length; i++ )
  for ( var j = 0; j < document.form[i].elements.length; j++ )
    /* have to do case-insensitive match to support any DOCTYPE */
    if ( document.form[i].elements[j].type.toUpperCase() == 'TEXT' )
      document.form[i].elements[j] = 'HAI!'; 
      /* done! */