Javascript：获取所有具有ID [x]的元素

使用javascript我如何获取ID为[x]的ID的元素数目？Javascript：获取所有具有ID [x]的元素

示例HTML：

<input name="vrow[0]" id="vrow[0]" value="0" type="text"/> 
<input name="vrow[1]" id="vrow[1]" value="0" type="text"/> 
<input name="vrow[2]" id="vrow[2]" value="0" type="text"/> 
<input name="vrow[3]" id="vrow[3]" value="0" type="text"/>

上述HTML是根据用户输入而产生。如何检测使用javascript有多少元素？

目前，我可以检测一个元素的存在这样的

示例JavaScript

if(document.getElementById('vrow[0]')){ 
var row=0; 
    } 
if(document.getElementById('vrow[1]')){ 
row=1; 
    } 
...

来源

2010-09-15 abel

[]are not valid characters in ID attributes在HTML4.01。即使是在HTML5，但是，你应该使用name属性（不带数字索引），然后用getElementsByName()：

<input name="vrow" value="0" type="text"/> 
<input name="vrow" value="0" type="text"/> 
<input name="vrow" value="0" type="text"/> 
<input name="vrow" value="0" type="text"/>

var vrows = document.getElementsByName("vrow"); 
alert(vrows.length);

注意老版本的IE浏览器和Opera都可以与具有id属性返回元素与中指定的名称相同的值getElementsByName（）。 IE也可以返回具有相同值的名称属性的非输入元素。

来源

2010-09-15 12:29:56

FWIW，getElementsByName（）没有在IE或Opera的支持。或者说，它被支持，但不正确：http://www.quirksmode.org/dom/w3c_core.html – Robusto 2010-09-15 12:39:40

谢谢。基本知识很重要。 – abel 2010-09-15 12:42:09

@Robusto：只要你注意这些问题，就不会有任何问题。更新我的答案以反映这一点。 – 2010-09-15 12:48:43

var inputTags = document.getElementsByTagName('INPUT'); 
var count=0; 
for(var i=0;i<inputTags.length;i++) 
if(inputTags[i].id.contains('vrow[') 
count++;

来源

2010-09-15 12:30:50

有趣。但我得到一个对象不支持这个属性或方法。 – abel 2010-09-15 12:37:05

getElementById总是返回一个元素（因为id是唯一的）。 getElementsByName可以产生一个元素列表。

<html> 
<head> 
<script> 
    function getElements() { 
    var elements = document.getElementsByName("vrow[]"); 
    alert(elements.length); 
    } 
</script> 
</head> 
<body onload="getElements()"> 
<input name="vrow[]" id="vrow_0" value="0" type="text"/> 
<input name="vrow[]" id="vrow_1" value="0" type="text"/> 
<input name="vrow[]" id="vrow_2" value="0" type="text"/> 
<input name="vrow[]" id="vrow_3" value="0" type="text"/> 
</body> 
</html>

来源

2010-09-15 12:32:17

如果您使用的是JavaScript库的查询功能支持CSS3，如原型，你可以使用属性开始，与选择查找ID属性与VROW [

所以在原型开始这会是

$$('input[id^=vrow[]').each

NB这是未经测试，你可能逃脱[在选择

Prototype $$ function

来源

2010-09-15 12:38:29

如果您要坚持你的输入元素的名称，你可以使用一些原因：

var inputs = Array.prototype.slice.call(document.getElementsByTagName('input')); 
var rows = inputs.filter(function (el) { return el.name.indexOf('vrow[') == 0 }); 
alert(rows.length);

来源

2011-10-27 14:13:47

Javascript：获取所有具有ID [x]的元素

回答

相关问题