javascript - 根据 ID 值选择 DOM 元素

Question

我在 DOM 中有一些文本框，例如

<INPUT id=txtQuantity587117 />
<INPUT id=txtQuantity587118 />
<INPUT id=txtQuantity587119 />
<INPUT id=txtQuantity587111 />
<INPUT id=txtQuantity587112 />

这些元素都是嵌套的，并且不在任何特定的父节点下。

有没有办法选择以“txtQuantity”开头的 id 文本的所有输入元素。

我想要一种使用 javascript 而不是 Jquery 的方法。谢谢。

Answer 1

在现代浏览器（以及 IE8...现在已验证）中，您可以使用document.querySelectorAll()选择attribute-starts-with器。

var els = document.querySelectorAll("input[id^=txtQuantity]");

Answer 2

这是一些不依赖于任何“现代”API调用的代码，除了 之外Array.filter，这比 shim 更容易document.querySelectorAll：

var els = [].filter.call(document.getElementsByTagName('input'), function(el) {
    return /^txtQuantity/.test(el.id);
});

使用适当的填充程序，这应该可以在 MSIE 5.5 以后的任何浏览器上运行。

见http://jsfiddle.net/alnitak/9jEzj/

Answer 3

没问题...

var inputs = document.getElementsByTagName("input");
var matches = [];

for(var i = 0; i < inputs.length; i++){
    var input = inputs[i];
    if(input.id.indexOf("txtQuantity") == 0){
        matches.push(input);
    }
}

//matches will be an array of the matched elements

这是一个工作示例