相关疑难解决方法(0)

我有如下元素

<div class="one">send Message</div>

<div class="one">send Message</div>

<div class="one">send Message</div>

我有一个网页，上面有像上面一样的发送消息按钮，其中一次只有一个按钮可见。其他两个按钮通过一些 javascript 代码隐藏。例如，如果第二个按钮可见，我应该能够得到只有那个元素。

所以我的代码将类似于

document.querySelector(".one:visible");

在 jquery 中，代码是$(".one:visible");，它工作正常，但我需要知道如何通过纯 javascript 来做到这一点。

有没有办法使用JavaScript选择具有给定样式的所有元素？

例如,我希望页面上所有绝对定位的元素.

我认为通过显式声明样式的样式更容易找到元素:

• 风格是非继承的(如定位)
• 样式不是默认值(如position:static).

我是否仅限于这些规则？当这些规则适用时,有更好的方法吗？

我很乐意使用选择器引擎,如果这是由一个提供(理想情况下Slick - Mootools 1.3)

编辑:
我想出了一个只适用于上述规则的解决方案.
它的工作原理是循环遍历每个样式规则,然后选择页面.
任何人都可以告诉我,循环所有元素是否更好(如所有解决方案中所推荐).
我知道在IE中我必须将样式更改为小写,但我可以使用cssText一次解析所有样式.为了简单起见,将其留下.
寻找最佳实践.

var classes = '';
Array.each(documents.stylesheets, function(sheet){
   Array.each(sheet.rules || sheet.cssRules, function(rule){
      if (rule.style.position == 'fixed') classes += rule.selectorText + ',';
   });
});
var styleEls = $$(classes).combine($$('[style*=fixed]'));