找回密码
 立即注册
CeraNetworksBGVM服务器主机交流会员请立即修改密码Sharktech防护
查看: 90|回复: 9

50元求份JS判断代码

[复制链接]

28

主题

36

回帖

262

积分

中级会员

积分
262
发表于 2022-1-10 17:31:12 | 显示全部楼层 |阅读模式
需要一段JS代码判断浏览器是否支持显示webp,如果支持就加载外部1.js否则加载2.js
回复

使用道具 举报

11

主题

1726

回帖

4311

积分

论坛元老

积分
4311
发表于 2022-1-10 17:35:43 | 显示全部楼层
[ol]
  • function WebpIsSupported(callback){
  •     // If the browser doesn't has the method createImageBitmap, you can't display webp format
  •     if(!window.createImageBitmap){
  •         callback(false);
  •         return;
  •     }
  •     // Base64 representation of a white point image
  •     var webpdata = 'data:image/webp;base64, UklGRiQAAABXRUJQVlA4IBgAAAAwAQCdASoCAAEAAQAcJaQAA3AA/v3AgAA=';
  •     // Retrieve the Image in Blob Format
  •     fetch(webpdata).then(function(response){
  •         return response.blob();
  •     }).then(function(blob){
  •         // If the createImageBitmap method succeeds, return true, otherwise false
  •         createImageBitmap(blob).then(function(){
  •             callback(true);
  •         }, function(){
  •             callback(false);
  •         });
  •     });
  • }
  • WebpIsSupported(function(isSupported){
  •     if(isSupported){
  •         console.log("支持");
  •     }else{
  •         console.log("不支持");
  •     }
  • });[/ol]复制代码
    把console.log("支持");或  console.log("不支持"); 改成输出你的JS就行了
  • 回复

    使用道具 举报

    131

    主题

    1347

    回帖

    4341

    积分

    论坛元老

    积分
    4341
    发表于 2022-1-10 17:35:55 | 显示全部楼层
    https://blog.csdn.net/weixin_33695450/article/details/89626831

    然后自个改改代码就行
    回复

    使用道具 举报

    15

    主题

    36

    回帖

    457

    积分

    中级会员

    积分
    457
    发表于 2022-1-10 17:35:56 | 显示全部楼层
    var isSupportWebp = function () {
      try {
        return document.createElement('canvas').toDataURL('image/webp', 0.5).indexOf('data:image/webp') === 0;
      } catch(err) {
        return false;
      }
    }

    isSupportWebp()







    function check_webp_feature(feature, callback) {
        var kTestImages = {
            lossy: "UklGRiIAAABXRUJQVlA4IBYAAAAwAQCdASoBAAEADsD+JaQAA3AAAAAA",
            lossless: "UklGRhoAAABXRUJQVlA4TA0AAAAvAAAAEAcQERGIiP4HAA==",
            alpha: "UklGRkoAAABXRUJQVlA4WAoAAAAQAAAAAAAAAAAAQUxQSAwAAAARBxAR/Q9ERP8DAABWUDggGAAAABQBAJ0BKgEAAQAAAP4AAA3AAP7mtQAAAA==",
            animation: "UklGRlIAAABXRUJQVlA4WAoAAAASAAAAAAAAAAAAQU5JTQYAAAD/////AABBTk1GJgAAAAAAAAAAAAAAAAAAAGQAAABWUDhMDQAAAC8AAAAQBxAREYiI/gcA"
        };
        var img = new Image();
        img.onload = function () {
            var result = (img.width > 0) && (img.height > 0);
            callback(feature, result);
        };
        img.onerror = function () {
            callback(feature, false);
        };
        img.src = "data:image/webp;base64," + kTestImages[feature];
    }






    const supportsWebp = ({ createImageBitmap, Image }) => {
      if (!createImageBitmap || !Image) return Promise.resolve(false);

      return new Promise(resolve => {
          const image = new Image();
          image.onload = () => {
              createImageBitmap(image)
                  .then(() => {
                      resolve(true);
                  })
                  .catch(() => {
                      resolve(false);
                  });
          };
          image.onerror = () => {
              resolve(false);
          };
          image.src = 'data:image/webp;base64,UklGRh4AAABXRUJQVlA4TBEAAAAvAAAAAAfQ//73v/+BiOh/AAA=';
      });
    };

    const webpIsSupported = () => {
      let memo = null;
      return () => {
          if (!memo) {
              memo = supportsWebp(window);
          }
          return memo;
      };
    };

    webpIsSupported()().then(res => {
        console.log("是否支持 webp", res)
    }).catch(err => {
        console.log(err)
    })


    回复

    使用道具 举报

    1

    主题

    28

    回帖

    105

    积分

    注册会员

    积分
    105
    发表于 2022-1-10 17:36:37 | 显示全部楼层
    一搜一堆,5毛钱流量就够
    回复

    使用道具 举报

    28

    主题

    36

    回帖

    262

    积分

    中级会员

    积分
    262
     楼主| 发表于 2022-1-10 17:36:59 | 显示全部楼层
    本帖最后由 白龙君 于 2022-1-10 17:38 编辑

    Salta 发表于 2022-1-10 17:35

    把console.log("支持");或  console.log("不支持"); 改成输出你的JS就行了


    妈的我眼瞎了,谢谢老哥我试试,可以了我私你。
    回复

    使用道具 举报

    15

    主题

    36

    回帖

    457

    积分

    中级会员

    积分
    457
    发表于 2022-1-10 17:35:00 | 显示全部楼层

    572149705 发表于 2022-1-10 17:35

    var isSupportWebp = function () {
      try {
        return document.createElement('canvas').toDataURL('ima ...

    改改  这种还要花钱吗  百度阿铁铁
    回复

    使用道具 举报

    94

    主题

    213

    回帖

    1362

    积分

    金牌会员

    积分
    1362
    发表于 2022-1-10 17:37:12 | 显示全部楼层
    https://cl1p.net/jsin
    很简单的解决方法
    stackoverflow找的
    回复

    使用道具 举报

    28

    主题

    36

    回帖

    262

    积分

    中级会员

    积分
    262
     楼主| 发表于 2022-1-10 17:35:00 | 显示全部楼层

    Salta 发表于 2022-1-10 17:35

    把console.log("支持");或  console.log("不支持"); 改成输出你的JS就行了

    直接填js地址不行啊
    回复

    使用道具 举报

    11

    主题

    1726

    回帖

    4311

    积分

    论坛元老

    积分
    4311
    发表于 2022-1-10 17:37:54 | 显示全部楼层

    白龙君 发表于 2022-1-10 17:51

    直接填js地址不行啊

    https://zhidao.baidu.com/question/718506054538000445.html
    回复

    使用道具 举报

    您需要登录后才可以回帖 登录 | 立即注册

    本版积分规则

    Archiver|手机版|小黑屋|HS2V主机综合交流论坛

    GMT+8, 2024-11-18 13:55 , Processed in 0.084629 second(s), 4 queries , Gzip On, Redis On.

    Powered by Discuz! X3.5

    © 2001-2024 Discuz! Team.

    快速回复 返回顶部 返回列表