Comment sélectionner une liste d'éléments par nom?

Question

Je veux sélectionner tous les éléments qui commencent par une séquence particulière. La séquence sera comme work_XXXXXX. comment y parvenir?

Answer 1

J'apporte des réponses à la fois jquery et javascript, mais la meilleure option est d'utiliser jquery car avec javascript vous devrez boucle throught tous les éléments et correspondent à vos patteren souhaités qui est processus très long si ma préférence est l'utilisation jquery:

trouve toutes les entrées avec un nom d'attribut commençant par 'work_' et y insérant du texte.

<input name="newsletter" /> 

<input name="work_man" /> 
<input name="work_boy" /> 
<script> 
    $('input[name^="work_"]').val('work here!'); 
</script> 

http://api.jquery.com/attribute-starts-with-selector/

http://api.jquery.com/category/selectors/

avec javascript leur est aucun mot-clé builtin pour cela, mais vous pouvez le faire en boucle à travers tous les éléments et vérifier correspondance de votre motif désiré, de cette façon:

var idStart = "work_"; 
var componentContainer = document.getElementById("containerTable").getElementsByTagName("DIV"); 
for (var i = 0; i < componentContainer.length; i++) { 
    var id = componentContainer[i].id; 
    if ((id.length >= idStart.length) && (id.substring(0, idStart.length - 1) == idStart))// you can also use regular expression here to match desired pattern 
    { 
      //do something... 
    } 
} 

Answer 2

Vous pouvez utiliser la même classe pour tous ces éléments et les sélectionner par classe.

Answer 3

Si vous voulez dire que le id attribut que vous pouvez faire ...

var elems = document.getElementsByTagName('*'); 

var myElems = []; 

for(var i = 0, length = elems.length; i < length; i++) { 

    if (elems[i].id.match(/^work_/)) { 
    myElems.push(elems[i]); 
    } 

} 

myElems contiendra tous les éléments où leur id attribut commence par work_.

See it on jsfiddle.net

Si vous voulez dire que le class attribut est un peu différent.

var elems = document.getElementsByTagName('*'); 

var myElems = []; 

for(var i = 0, length = elems.length; i < length; i++) { 

    var classes = elems[i].className.split(' '); 

    for (var j = 0, classesLength = classes.length; j < classesLength; j++) {  
     // If you have a trim function, use it on the class name. 
     if (classes[j].match(/^work_/)) { 
      myElems.push(elems[i]); 
      break; 
     } 
    } 

} 

See it on jsfiddle.net

Bien sûr, si vous utilisez une bibliothèque telle que jQuery, il est beaucoup plus facile.

$('*[id^=work')