jquery: get Elemente nach Klassennamen und fügen Sie css zu jedem von ihnen

Question

Ich habe eine bestimmte Anzahl von Div-Boxen, die alle den gleichen Klassennamen haben. Ich versuche, etwas auf sie alle anzuwenden, aber habe kein Glück. Der Code, den ich bisher gebaut ist

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

Könnten Sie mir bitte sagen, was ich tue, falsch

Answer 1

Sie können versuchen, diese

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

Die $('div.easy_editor') bezieht sich auf eine Sammlung aller divs, die haben der Klasse easy Editor schon. Es gibt keine Notwendigkeit, jedes() zu verwenden, es sei denn, es gab eine Funktion, die Sie auf jedem ausführen wollten. Die Methode css() gilt tatsächlich für alle divs, die Sie finden.

Answer 2

Was macht jQuery einfach zu bedienen ist, dass Sie keine Attribute für jedes Element anwenden müssen. Das jQuery-Objekt enthält ein Array von Elementen, und die Methoden des jQuery-Objekts wenden dieselben Attribute auf alle Elemente im Array an.

Es gibt auch eine kürzere Form für $(document).ready(function(){...}) in .

Also, das alles ist, was Sie brauchen:

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

Wenn Sie den Code wollen mit dieser Klasse für jedes Element zu arbeiten, kann man einfach die Klasse in der Auswahl ohne den Tag-Namen angeben:

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