如何查看浏览器是否支持CSS general sibling selector~

Question

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

示例：

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

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

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 属性，或者 querySelector 使用 Vanilla JS。

点赞 here。