Имя класса javascript совпадает с addClass jQuery?

Question

Мне было интересно, если classname в javascript то же самое, что и addClass в jQuery. Я хочу изменить следующую функцию JQuery:

function slidePageFrom(page, from) { 
     // Position the page at the starting position of the animation 
     page.className = "page " + from; 
     // Position the new page and the current page at the ending position of their animation with a transition class indicating the duration of the animation 
     page.className ="page transition center"; 
     currentPage.className = "page transition " + (from === "left" ? "right" : "left"); 
     currentPage = page; 
    } 

HTML:

<section id="homePage" class="page center" style="background-color: #add55a"> 
     <h1>Home Page</h1> 
     <a href="javascript:slidePageFrom(page1, 'right');">Page 1</a> 
    </section> 

    <section id="p1" class="page right" style="background-color: #8ca83d"> 
     <h1>Page 1</h1> 
     <a href="javascript:slidePageFrom(page2, 'right');">Back</a> 
    </section> 
    <section id="p2" class="page right" style="background-color: #8ca83d"> 
     <h1>Page 2</h1> 
     <a href="javascript:slidePageFrom(homePage, 'left');">Back</a> 
    </section> 

Answer 1

className свойство узла DOM элемент представляет собой разделенный пробелами список всех классов на этом узле , Если элемент имеет классы «a», «b» и «c», то .className будет "a b c" (возможно, в другом порядке, так как заказ не имеет значения).

Напротив, функции jQuery .addClass() и .removeClass() выполняют то, что они говорят: добавьте класс (если его еще нет) или удалите класс (если он есть). Эти операции влияют только на классы; другие остаются на месте.

Таким образом, ответ заключается в том, что методы jQuery предоставляют вам абстракцию для управления свойством .className, но неправильно утверждать, что они являются «теми же».

Обратите внимание, что в функции, с этих первых двух утверждений:

page.className = "page " + from; 
    // Position the new page and the current page at the ending position of their animation with a transition class indicating the duration of the animation 
    page.className ="page transition center"; 

второе назначение на .className имущество полностью перепишет значение помещается там первое заявление. Другими словами, независимо от значения from, значение page.className после второго заявления будет всегда be "page transition center". Если, с другой стороны, второй оператор использовал JQuery .addClass():

$(page).addClass("page transition center"); 

то после этого все, что имя класса был в from все равно будет там.