js が CSS 属性 (値) のサポートを決定して通知する状況の分析

/**
 * ブラウザにサポートされている特定の CSS プロパティを通知します* @param {String} key - CSS プロパティ。プロパティの名前です。プレフィックスは不要です* @returns {String} - サポートされているプロパティ*/
関数validateCssKey(キー) {
    const jsKey = toCamelCase(key); // 一部の CSS プロパティはハイフンで区切られます if (jsKey in document.documentElement.style) {
        リターンキー;
    }
    validKey = '' とします。
    // 属性名は js のプレフィックスの形式、属性値は css のプレフィックスの形式です // 試してみたところ、Webkit は先頭文字を小文字にした webkit にもできることがわかりました
    定数プレフィックスマップ = {
        Webkit: '-webkit-',
        モズ: '-moz-',
        ms: '-ms-',
        お: 「-お-」
    };
    (const jsPrefix in prefixMap) {
        const styleKey = toCamelCase(`${jsPrefix}-${jsKey}`);
        document.documentElement.style の styleKey の場合 {
            有効なキー = prefixMap[jsPrefix] + キー;
            壊す;
        }
    }
    有効なキーを返します。
}

/**
 * ハイフン付き文字列をキャメルケース文字列に変換します*/
関数 toCamelCase(値) {
    戻り値.replace(/-(\w)/g, (一致, 文字) => {
       letter.toUpperCase() を返します。
   });
}

/**
 * ブラウザが特定の CSS 属性値をサポートしているかどうかを確認します (es6 バージョン)
 * @param {String} キー - チェックするプロパティ値が属する CSS プロパティの名前 * @param {String} 値 - チェックする CSS プロパティ値 (プレフィックスなし)
 * @returns {String} - ブラウザでサポートされているプロパティ値を返します */
関数validateCssValue（キー、値）{
    const プレフィックス = ['-o-', '-ms-', '-moz-', '-webkit-', ''];
    const prefixValue = prefix.map(item => {
        アイテム + 値を返します。
    });
    定数要素 = document.createElement('div');
    eleStyle 要素のスタイルを定義します。
    // 各プレフィックスを適用し、最後にプレフィックスなしのケースを適用して、どのケースがブラウザで機能するかを確認します。 // これが、プレフィックスの最後の要素を '' にするのが最適な理由です。
    prefixValue.forEach(item => {
        eleStyle[キー] = 項目;
    });
    eleStyle[キー]を返します。
}

/**
 * ブラウザが特定の CSS プロパティ値をサポートしているかどうかを確認します * @param {String} キー - チェックするプロパティ値が属する CSS プロパティ名 * @param {String} 値 - チェックする CSS プロパティ値 (プレフィックスなし)
 * @returns {String} - ブラウザでサポートされているプロパティ値を返します */
関数validateCssValue（キー、値）{
    var プレフィックス = ['-o-', '-ms-', '-moz-', '-webkit-', ''];
    var プレフィックス値 = [];
    (var i = 0; i < プレフィックス長さ; i++) {
        prefixValue.push(prefix[i] + 値)
    }
    var 要素 = document.createElement('div');
    var eleStyle = 要素.style;
    (var j = 0; j < prefixValue.length; j++) {
         eleStyle[キー] = prefixValue[j];
    }
    eleStyle[キー]を返します。
}

関数validCss(キー,値){
    定数validCss = validCssKey(キー);
    有効なCSSの場合
        有効なCSSを返します。
    }
    戻り値:validateCssValue(キー、値);
}