根据ID值选择DOM元素

Selecting DOM elements based on ID values

本文关键字:DOM 元素 选择 ID 根据      更新时间:2023-09-26

DOM中有一些文本框,比如

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

元素都是嵌套的,不在任何特定的父节点下。

是否有一种方法可以选择所有id text以"txtQuantity"开头的输入元素?

我想要一个方法与javascript,而不是与Jquery。谢谢。

在现代浏览器中(也包括IE8)…现在验证),您可以使用document.querySelectorAll()作为attribute-starts-with选择器。

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

这里有一些代码,不依赖于任何"现代"的API调用除了Array.filter,这是比document.querySelectorAll容易得多:

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

使用适当的shim,这应该可以在MSIE 5.5以后的任何浏览器上工作。

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

没问题…

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

下面是一个工作示例