.addClass( className )
מחזירה: jQuery
תיאור: מוסיף מחלקה/ות לכל אלמנט ברשימה.
.addClass( className )
הוספה בגרסה: 1.0
className
אחד או יותר שמות של מחלקה להוספה לתכונה מחלקה לכל אלמנט בהתאמה.
.addClass( function(index, class) )
הוספה בגרסה: 1.4
function(index, class)
פונקציה מחזירה אחד או יותר שמות של מחלקה, מופרדים ברווחים, להוספה.
מקבל אינדקס של מיקום של אלמנט בסט וערך של מחלקה הישנה בתור ארגומנטים.
חשוב לציין ששיטה הזו לא מחליפה מחלקה. היא פשוט מוסיפה מחלקה למחלקה אחרת, שכבר צורפה לאלמנט.
יותר ממחלקה אחת ניתן להוסיף בו זמנית, מופרדות עם רווחים, לסט אלמנטים בהתאמה, כמו:
$('p').addClass('myClass yourClass');
שיטה הזו בדרך כלל משתמשת עם
.removeClass()
כדי להעביר מחלקות של האלמנט מאחת לשניה, כמו:
$('p').removeClass('myClass noClass').addClass('yourClass');
כאן, מחלקה
myClass ו- noClass
נמחקו מכל הפסקאות, בזמן ש-
yourClass הוספה.
החל מ- jQuery 1.4, שיטה .addClass()
מאפשרת לנו להגדיר שם של מחלקה, באמצעות שליחה אותו לפונקציה.
ברשימה לא מסודרת עם חמישה אלמנטים
<li>,
דוגמה זו תוסיף מחלקה
"item-4"
ל-
<li>
אחרון
.
דוגמאות
דוגמה 1
מוסיף מחלקה 'selected' לאלמנט בהתאמה.דוגמה 1 - קוד מלא:
<!DOCTYPE html> <html> <head> <script src="http://code.jquery.com/jquery-latest.js"></script> <script> $(document).ready(function(){ $("p:last").addClass("selected"); }); </script> <style> p { margin: 8px; font-size:16px; } .selected { color:blue; } .highlight { background:yellow; } </style> </head> <body> <p>Hello</p> <p>and</p> <p>Goodbye</p> </body> </html>
דוגמה 2
מוסיף מחלקות 'selected' ו- 'highlight' לאלמנטים בהתאמה.
דוגמה 2 - קוד מלא:
<!DOCTYPE html> <html> <head> <script src="http://code.jquery.com/jquery-latest.js"></script> <script> $(document).ready(function(){ $("p:last").addClass("selected highlight"); }); </script> <style> p { margin: 8px; font-size:16px; } .selected { color:red; } .highlight { background:yellow; } </style> </head> <body> <p>Hello</p> <p>and</p> <p>Goodbye</p> </body> </html>
האם מידע זה היה מועיל?
