object.className или object.getAttribute ("className / class")? - PullRequest
7 голосов
/ 04 июля 2011

Между обоими:

Javascript

function setCss(object, css) {
    return (object.className = css);
}
function getCss(object, css) {
    return object.className;
}

Или

function getCss2(object)
{   
    if (object.getAttribute("className")) {
        return object.getAttribute("className");
    }
    return object.getAttribute("class");
}


function setCss2(object, cssclass)
{        
    if (object.getAttribute("className")) {
        return object.setAttribute("className",cssclass);
    }
    object.setAttribute("class",cssclass);
}

HTML

<a href="#" onClick="setCss(this, 'newclass')" />
<a href="#" class="something" onClick="alert(getCss(this))" />
<a href="#" onClick="setCss2(this, 'newclass')" />
<a href="#" class="something" onClick="alert(getCss2(this))" />

Обе версии работают в IE8, FF4, Chrome, Opera и Safari. ( jsFiddle (улучшено) демо )

Какая практика лучше всего используется и почему? Вы когда-нибудь сталкивались с какой-либо проблемой с любой версией?

Ответы [ 3 ]

9 голосов
/ 04 июля 2011

object.getAttribute("className"); на самом деле не работает.

Разница в том, что getAttribute получает значение атрибута HTML , как оно написано в коде HTML (за некоторыми исключениями),

Эти значения в основном также являются начальными значениями свойств элемента DOM .Но доступ к ним может привести к различным значениям из-за предварительной / постобработки.

Например, если у вас есть элемент <a>, el.href дает вам полный (абсолютный) URL, тогда как el.getAttribute('href') даетURL, который был написан в HTML.

В большинстве случаев вы хотите получить доступ к свойствам элемента DOM, поскольку они отражают текущее состояние элемента.

6 голосов
/ 04 июля 2011

getAttribute("class") более универсален, поскольку может использоваться в различных типах документов.В XML-документах самое главное.В том числе SVG.

element.className работает только в HTML.Это описано в HTML-спецификациях DOM уровня 2 .

1 голос
/ 04 июля 2011

Используйте первый.

Это сортировщик.Он работает в любом браузере, даже в самых старых, которые не поддерживают getAttribute.Это, вероятно, тоже быстрее.

Но, пожалуйста, не используйте функцию для этого.Просто используйте this.className и this.className = 'newClass'.Использование функции излишне для этого.

...