从JavaScript更改CSS类内容[Firefox / XUL] [英] Change CSS class content from javascript [Firefox/XUL]

问题描述

我正在开发一个Firefox插件，并严重依赖于JavaScript的一些动态变化。有一些UI元素（hbox / descriptions），它们使用CSS类来设计。现在我想改变一个JavaScript的CSS类定义，而不必工作元素ID的。是否有可能？

以前也有类似的问题，但是大多数都是使用php来生成一个基于CSS或jquery的更改。
这是我的场景的一个例子：
我的XUL：

pre $ < box id =firefox-插件箱>
< description id =description-1class =description-text>一些描述< /描述>
< description id =description-2class =description-text>一些描述< /描述>
< / box>


我的CSS：

  .description-text {
 font-size：15px; 
颜色：#fff; 
 
 
 
 $ b $ p 
 $ b 
所以我想改变中的字体大小，描述文本类动态地说20px。 
现在我知道我们可以改变风格使用个人的身份证，用 getElementById（）和改变风格。但是在这里，我希望改变一个班级（这对很多元素来说都很重要），而不是去处理个人ID。 
我也知道 setAttribute（）指向另一个类的定义，并改变'class' - 这将再次需要在个人ID上工作。实际上，我有很多UI元素（都指向一个CSS类），并且在CSS类中更改了许多值。所以我的问题是，有没有办法直接从JavaScript的CSS类定义，而不必工作的元素ID？ 
感谢您的帮助。
 
解决方案
 
  myVar = document.getElementsByClassName（描述文本）; 
  
  document.getElementsByClassName  
 
I'm working on a firefox addon, and relies heavily on some dynamic changes with javascript. There are some UI elements (hbox/descriptions), which are styled using CSS classes. Now I wish to change the  a CSS class defintion from javascript, without having to work element id's. Is it possible ?

Similar questions had been asked before, but most of them are using php to generate a CSS or jquery based changes. 
Here's an example for my scenario: 
My XUL : 
<box id="firefox-addon-box">
  <description id="description-1" class="description-text"> Some description </description>
  <description id="description-2" class="description-text"> Some description </description>
</box>
My CSS : 
.description-text {
  font-size: 15px; 
  color: #fff; 
}
So I wish to change the font-size in description-text class to say, 20px dynamically. 
Now I know that we can change the style using individual id's, with a getElementById() and changing the style. But here I wish to change a class (which matters to a lot of elements), rather than to work on individual ids.
I also know that we can point to another class definition by setAttribute() and change 'class' - this would again require working on individual id's. In reality, I have plenty of UI elements (all pointing to one CSS class), and many values changed in a CSS class. So my question is, is there a way to directly change a CSS class definition from javascript, without having to work on element ids ?
Thanks for any help.
解决方案
myVar = document.getElementsByClassName("description-text"); 
document.getElementsByClassName

                        
这篇关于从JavaScript更改CSS类内容[Firefox / XUL]的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！