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

Question

Какова концепция обнаружения поддержки любого псевдокласса CSS в браузере через JavaScript?Точно, я хочу проверить, поддерживает ли браузер пользователя псевдокласс :checked или нет, потому что я сделал несколько всплывающих окон CSS с флажками и должен сделать откат для старых браузеров.

ОТВЕТ: Я нашел уже реализованный метод тестирования css-селекторов в Modernizr "Дополнительные тесты" .

Answer 1

Вы можете просто проверить, был ли применен ваш стиль с псевдоклассом.

Примерно так: http://jsfiddle.net/qPmT2/1/

Answer 2

stylesheet.insertRule (rule, index) метод выдаст ошибку, если правило недействительно.так что мы можем использовать это.

var supportPseudo = function (){
    var ss = document.styleSheets[0];
    if(!ss){
        var el = document.createElement('style');
        document.head.appendChild(el);
        ss = document.styleSheets[0];
        document.head.removeChild(el);
    }
    return function (pseudoClass){
        try{
            if(!(/^:/).test(pseudoClass)){
                pseudoClass = ':'+pseudoClass;
            }
            ss.insertRule('html'+pseudoClass+'{}',0);
            ss.deleteRule(0);
            return true;
        }catch(e){
            return false;
        }
    };
}();


//test
supportPseudo(':hover'); //true
supportPseudo(':before'); //true
supportPseudo(':hello'); //false
supportPseudo(':world'); //false

Answer 3

Если вы в порядке с использованием Javascript, вы можете пропустить обнаружение и перейти прямо к шим: Селективизр