https://static.leiting.com/lib/check_webp.js

1// 检测webp支持情况
2function check_webp_feature(feature, callback) {
3    var kTestImages = {
4        lossy: "UklGRiIAAABXRUJQVlA4IBYAAAAwAQCdASoBAAEADsD+JaQAA3AAAAAA",
5        lossless: "UklGRhoAAABXRUJQVlA4TA0AAAAvAAAAEAcQERGIiP4HAA==",
6        alpha: "UklGRkoAAABXRUJQVlA4WAoAAAAQAAAAAAAAAAAAQUxQSAwAAAARBxAR/Q9ERP8DAABWUDggGAAAABQBAJ0BKgEAAQAAAP4AAA3AAP7mtQAAAA==",
7        animation: "UklGRlIAAABXRUJQVlA4WAoAAAASAAAAAAAAAAAAQU5JTQYAAAD/////AABBTk1GJgAAAAAAAAAAAAAAAAAAAGQAAABWUDhMDQAAAC8AAAAQBxAREYiI/gcA"
8    };
9    var img = new Image();
10    img.onload = function() {
11        var result = (img.width > 0) && (img.height > 0);
12        callback(feature, result);
13    };
14    img.onerror = function() {
15        callback(feature, false);
16    };
17    img.src = "data:image/webp;base64," + kTestImages[feature];
18}
19check_webp_feature('lossy', function(type, support) {
20    if (support) {
21        document.getElementsByTagName('html')[0].classList.add('webp');
22        console.info('support webp ' + type);
23    } else {
24        document.getElementsByTagName('html')[0].classList.add('no-webp');
25        console.warn('no support webp ' + type);
26    }
27});