Можно ли получить все глобальные / наследовать классы CSS, примененные к элементу? - PullRequest
2 голосов
/ 02 ноября 2010

Мне нужна функция javascript, которая может получить все классы CSS, примененные к элементу.

У нас есть такие функции, как getComputedStyle (element, "") и currentStyle (), FF и IE соответственно.Но эти функции дают мне только CSS-свойства, применяемые к элементу, а не к классам.

Чтобы прояснить ситуацию, посмотрите следующую структуру DOM.

<html>
 <head>
 <style>
.dd{
    font-weight:bold;
}
.dd span{
    border:solid 1px #ABABAB;
}
</style>
 </head>
 <body>
  <div class='dd'>  
    <span id='span1'>Hi this is a example</span>
  </div>
 </body>
</html>

Теперь, что такое JavaScriptЕсли я получу элемент 'span1', он должен дать мне все классы, которые применяются к этому элементу.Скажите, что вывод должен дать мне ".dd span and .dd"

Ответы [ 2 ]

0 голосов
/ 04 ноября 2014

Как продолжение ответа Стива, вы можете просто пройтись по родительским узлам и перечислить имена классов для каждого родительского узла.

var listClasses = function(element){ 
    while(element){
        console.log(element.className);
        element = element.parentNode;
    }
}

Для использования:

listClasses(target);
0 голосов
/ 02 ноября 2010
document.getElementById('span1').className;

и вы можете использовать .parentNode для получения различных родительских классов.

И, если вы дадите старшему родителю стиль position, вы можете использовать это:

var topmost = document.getElementById('span1').offsetParent;

for(var x = 0; x < topmost.childNodes.length;x++) {
  alert(topmost.childNodes[x].className);
}

// Редактировать

Похоже, вы пытаетесь делать что-то типа Firebug. Многие пользователи здесь на SO пробовали то же самое. Хороший поиск может привести вас к вещам, о которых вы никогда не мечтали ... махахахаха ...

...