Javascript: Obtenez tous les éléments avec l'id id [x]

À l'aide de javascript comment puis-je obtenir le nombre d'éléments présents avec l'id de id[x]?

Exemple de code 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"/>

Ci-dessus le code html est généré en fonction de l'entrée utilisateur. Comment puis-je détecter combien d'éléments sont présents à l'aide de javascript?

Actuellement je peux détecter la présence d'un élément comme ce

Exemple De Code Javascript

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

source d'informationauteur abel

  1. 16

    [] ne sont pas des caractères valides dans les attributs ID en HTML4.01. Même en HTML5, cependant, vous devez utiliser le nom de l'attribut (sans les indices numériques), et ensuite utiliser 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);

    Noter que les anciennes versions d'IE et Opera peut retourner des éléments avec id attributs qui ont la même valeur que le nom spécifié dans getElementsByName(). IE peut également renvoyer à la non-saisie d'éléments ayant un attribut name qui a la même valeur.

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

    Si pour une raison quelconque vous voulez coller avec le nom de votre saisie d'éléments que vous pouvez utiliser:

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

    getElementById retourne toujours un élément (puisque les id sont uniques). getElementsByName peut résulter d'une liste d'éléments.

    <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>
  5. 2

    Si vous utilisez une bibliothèque JavaScript avec une fonction de requête de soutien CSS3, comme Prototype, vous pouvez utiliser l'attribut commence-avec sélecteur de trouver des attributs id commençant par vrow[

    Donc à l'état de Prototype, ce serait

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

    NB ce n'est pas testée, vous pourriez avoir à échapper à la [ dans le sélecteur

    Prototype $ fonction$