Ottieni elemento HTML utilizzando jQuery

Question

Ho alcuni DIV con ID "div1", "div2" ... "divx". Voglio eseguire un'operazione su di loro. C'è un modo per ottenere l'ID dell'elemento. Contiene "div". Qualche altra idea?

Answer 1

È possibile utilizzare il starts with selector

$("div[id^='div']") 

È possibile che catturerà tutti i div che hanno un attributo id che inizia con le lettere div.

jsFiddle example that makes all divs with id div... invisible.

---

Ecco come gestire il caso più complicato, se si desidera far corrispondere div seguito da un numero, ma non div seguito da qualcos'altro. Quindi div1 corrisponderebbe, ma non lo sarebbe il divx.

In questo caso si utilizza filter() con una funzione. La funzione dovrebbe restituire true per quando vogliamo una corrispondenza e false per quando non lo facciamo. match() e una regex è grande per questo (è possibile utilizzare [0-9] per rappresentare una cifra in una regex o la semplice [\d]):

$("div").filter(function() { 
    return $(this).attr("id").match(/^div[\d]+$/) 
}) 

attr() restituisce il valore dell'attributo specificato, in questo caso id.

jsFiddle example that makes all div followed by number disappear, but not div followed by other things.

Answer 2

Si potrebbe utilizzare questo (non ho ancora testato, però):

jQuery("div[id^='div']") 

Ciò ottenere tutti div elementi che hanno un inizia con id "div".

Se si voleva tutti i div elementi che hanno un idcontenente "div", allora si potrebbe utilizzare questo:

jQuery("div[id*='div']") 

Answer 3

utilizzando l'ID di come div1, div2, div3 è una cattiva pratica. È come nominare le tue classi "black-bold-12px" e quindi assegnare quegli stili a quella classe. Manca il punto sulla semantica.

Il modo giusto per farlo sarebbe utilizzare una classe per tutti.

Gli elementi possono essere di più di una classe, utilizzando uno spazio come separatore:

<div class="something usethis">...</div> 
<div class="usethis something_else">...</div> 
<div class="usethis">...</div> 
<div class="something anotherclass usethis" id="someId">...</div> 

<script> 
    $(".usethis").html("New contents for all of them!"); 
</script>