是否可以将所有全局/继承css类应用于元素？

I need a javascript function that can get me all the CSS classes applied to an element.

我需要一个javascript函数，可以获取应用于元素的所有CSS类。

We have function like getComputedStyle(element,"") and currentStyle(), FF and IE respectively. But, these function only give me the CSS properties applied to the element, not the classes.

我们分别具有getComputedStyle（element，“”）和currentStyle（），FF和IE的功能。但是，这些函数只给我应用于元素的CSS属性，而不是类。

To make things more clear please see the following DOM structure.

为了使事情更清楚，请参阅以下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>

Now what the javascript should is if i get the element 'span1' it should give me all the classes that are applied to this element. Say the output should be giving me ".dd span and .dd"

现在javascript应该是什么，如果我得到元素'span1'它应该给我所有应用于这个元素的类。说输出应该给我“.dd span和.dd”

2 个解决方案

#1

document.getElementById('span1').className;

and you can use .parentNode to get various parent classes.

并且您可以使用.parentNode来获取各种父类。

And, if you give the topmost parent a position style, you could use this:

而且，如果你给最*的父母一个职位风格，你可以使用这个：

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

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

// Edit

//编辑

It looks like you're trying to do a Firebug type of thing. A lot of users here on SO have tried the same. A good search might lead you to things you never dreamed of...muhahahaha....

看起来你正试图做一个Firebug类型的东西。 SO上的很多用户尝试过同样的尝试。一个好的搜索可能会引导你做你从未梦想过的事...... muhahahaha ....

#2

As a continuation from Steve's answer, you can just loop through the parent nodes and list the class names for each parent node.

作为Steve的答案的延续，您可以循环访问父节点并列出每个父节点的类名。

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

To Use:

使用方法：

listClasses(target);

#1

document.getElementById('span1').className;