jQuery addClass方法是一種用于向指定元素添加一個或多個類的方法。使用該方法可以方便地在網頁中動態地添加CSS類，讓網頁樣式更加豐富多彩。那么，它的原理是什么呢？

// 源碼片段
jQuery.fn.extend({
addClass: function(value) {
var classes, elem, cur, clazz, j, finalValue,
i = 0,
len = this.length,
proceed = typeof value === "string" && value;
if (jQuery.isFunction(value)) {
return this.each(function(j) {
jQuery(this).addClass(value.call(this, j, this.className));
});
}
if (proceed) {
// 把要添加的類通過空格轉換為數組
classes = (value || "").match(core_rnotwhite) || [];
// 遍歷所有元素
for (; i< len; i++) {
elem = this[i];
cur = elem.nodeType === 1 && (elem.className ?
(" " + elem.className + " ").replace(rclass, " ") :
" ");
if (cur) {
j = 0;
while ((clazz = classes[j++])) {
if (cur.indexOf(" " + clazz + " ")< 0) {
cur += clazz + " ";
}
}
// 把最終的類字符串賦值給當前元素
finalValue = jQuery.trim(cur);
if (elem.className !== finalValue) {
elem.className = finalValue;
}
}
}
}
return this;
},
})

從上面的源碼片段可以看出，addClass方法的原理可以概括為以下幾個步驟：

• 將要添加的類字符串通過空格分隔成一個數組。
• 遍歷所有的元素。
• 對于每個元素，先獲取它的當前類字符串，然后遍歷要添加的類數組，將不存在的類字符串拼接進當前類字符串中。
• 最后將拼接后的類字符串賦值給當前元素的className屬性，完成添加類的操作。

總的來說，jQuery的addClass方法實現非常簡潔和實用，可以方便地實現CSS類的動態添加，大大提高了網頁開發的效率。