7

私は Modernizr を初めて使用し、ブラウザの全体的な互換性を確認する簡単な方法を探しています。HTML5、CSS3、および最新の JavaScript メソッドに大きく依存している Web アプリケーションの最も重要なコンポーネントのみをテストするために、Modernizr スクリプトを生成しました。これらすべてのテストを同時に実行する方法はありますか? ドキュメントに目を通すと、各機能を 1 つずつテストする方法はたくさんありますが、すべてを一度に行う方法は見当たりません。私はこのようなことをしたいと思っています:

疑似コード

if (Modernizr.testAll()) {
  // Load site
} else {
  // Redirect to compatibility page
}
4

7 に答える 7

6

すべてのテストがブール値としてオブジェクトに直接格納されていることが判明したModernizrため、多くの機能依存関係を持つアプリケーションを構築していて、それらを一度にすべてテストしたい場合は、これを使用します。

var supported = true;
for (var feature in Modernizr) {
  if (typeof Modernizr[feature] === "boolean" && Modernizr[feature] == false) {
    supported = false;
    break;
  }
}
于 2013-08-31T23:43:08.717 に答える
0

私は同じものを探していて、次のコードを思いつきました：

for (var feature in Modernizr) 
{
    if (typeof Modernizr[feature] === "boolean")
    {
        console.log("Modernizr_" + feature + ": " +Modernizr[feature]);

        for (var subFeature in Modernizr[feature])
        {
            if (typeof Modernizr[feature][subFeature] === "boolean")
            {
                console.log("Modernizr_" + feature + "_"+ subFeature + ": " + Modernizr[feature]);          
            }
        }
    }


}

チッ！

于 2015-08-24T08:07:07.640 に答える
0

最新の Javascript (ECMAScript 2017) を使用すると、次のObject.valuesようにメソッドを利用できます。

if (Object.values(Modernizr).indexOf(false) !== -1) {
    console.log('Update your browser (and avoid IE/Edge )')
}

Object.valuesModernizrからすべてのテスト結果を配列に抽出しindexOf(false)、配列項目のいずれかが false (つまり、テストが失敗した) かどうかをテストします。

于 2019-07-26T22:38:01.520 に答える
0

すべての機能検出をブラウザーに表示する場合は、次のコードを使用します。

<!DOCTYPE html>

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Modernizr Test</title>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/modernizr/2.0.6/modernizr.min.js"></script>

</head>
<body>
<h1>Feature Detection</h1>
<div id="feature-detection-result">

</div>
<script>
    var features = Object.keys(Modernizr);
    features = features.sort();

    features.forEach(feature => {
        if (typeof Modernizr[feature] === "boolean") {
            var element = document.createElement('p');
            element.innerHTML = feature + ' ' + Modernizr[feature];
            document.getElementById('feature-detection-result').appendChild(
                element
            );
            console.log(feature, Modernizr[feature]);
        }
        }
    );
</script>
</body>
</html>

于 2020-06-02T12:59:04.520 に答える