jquery: ottiene gli elementi in base al nome della classe e aggiunge css a ciascuno di essi

Question

Ho un certo numero di caselle div che hanno tutti lo stesso nome di classe. Sto cercando di applicare qualcosa a tutti loro ma non ho fortuna. Il codice ho costruito finora è

$(document).ready(function(){ 
    elements = $('div.easy_editor'); 
    elements.each(function() { $(this).css("border","9px solid red"); }); 
    //elements[0].css("border","9px solid red"); 
}); 

La prego di dirmi che cosa sto facendo male

Answer 1

si può provare questo

$('div.easy_editor').css({'border-width':'9px', 'border-style':'solid', 'border-color':'red'}); 

La $('div.easy_editor') si riferisce ad una raccolta di tutti i div che hanno l'editor di classe facile già. Non è necessario usare each() a meno che non ci fosse qualche funzione che si desidera eseguire su ciascuno. Il metodo css() si applica in realtà a tutti i div che trovi.

Answer 2

Ciò che rende jQuery facile da usare è che non è necessario applicare attributi a ciascun elemento. L'oggetto jQuery contiene una matrice di elementi e i metodi dell'oggetto jQuery applicano gli stessi attributi a tutti gli elementi dell'array.

C'è anche un modulo più breve per $(document).ready(function(){...}) in .

Quindi, questo è tutto ciò che serve:

$(function(){ 
    $('div.easy_editor').css('border','9px solid red'); 
}); 

Se si desidera che il codice funzioni per ogni elemento con quella classe, si può solo specificare la classe nel selettore senza il nome del tag:

$(function(){ 
    $('.easy_editor').css('border','9px solid red'); 
});