javascript - 如何查看浏览器是否支持CSS通用兄弟选择器~

Question

如果浏览器支持 css 通用兄弟选择器 ~，我如何使用 Javascript (jQuery) 进行测试？

例子:

#toggled:checked ~ #sidebar {
    display: block;
}

该 CSS 代码在 IE 8-、Firefox 3-、Safari 3.1- 中不起作用，因此在这些情况下，我需要应用 Javascript 替代方案来显示 #sidebar block 。

Answer 1

@epascarello 在评论中是正确的，为什么不使用 JS？

例如，在 JS 中(未经测试 - 使用 jQuery):

let isRuleApplied = (selector, keyApplied, valueApplied) => {
  let element = $(selector);
  return element && element.css(keyApplied) === valueApplied;
};

console.log(isRuleApplied('#toggled:checked ~ #sidebar', 'display', 'block'));

或者只使用 getElementById 节点的 style 属性，或者使用 Vanilla JS 的 querySelector。

感谢这个想法 here .