Как проверить, поддерживает ли браузер общий селектор брата в CSS?

Question

Как я могу проверить с помощью Javascript (jQuery), если браузер поддерживает общий селектор css ~?

Пример:

#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'));

Или просто используйте style свойство узла getElementById или querySelector с использованием Vanilla JS.

Слава идее здесь .