Question

我有一个元素

<div class="x-window-header  x-header x-header-draggable x-docked 
 x-unselectable x-window-header-default x-horizontal x-window-header-horizontal 
 x-window-header-default-horizontal x-top x-window-header-top x-window-header-default-top 
 x-box-layout-ct" id="messagebox-1001_header"></div>

如何识别哪个类定义了background-color属性？我试过了：

var headercls_list = document.getElementById('message-box').firstChild.classList;
      for (i = 0; i < headercls_list.length; i++) 
          {
            if (document.getElementsByClassName(headercls_list[i]).hasOwnProperty('background-color')) 
                {
                    headercls_list[0].style.backgroundColor = '#F00';
                }
          }

即使是属性为background-color的正确类也会返回false！这有什么不对？我正在使用DOM。如果可以用extjs完成。请建议

Answer 1

使用jQuery：

$(document.getElementsByClassName(headercls_list[i])).css('background-color') !== 'rgba(0, 0, 0, 0)'

或没有jQuery：

var el = document.getElementsByClassName(headercls_list[i])[0];
var backgroundColor = window.getComputedStyle(el).getPropertyValue('background-color');
background !== 'rgba(0, 0, 0, 0)'

如果它对您不起作用，则更高级的方法是使用https://github.com/Box9/jss。然后，您可以详细分析每个班级：

jss.get('.my-class')['background-color']

如何识别css类是否在extjs中具有属性

1 个答案: