webp格式的图片就不详细介绍了,目前是只有Chrome 谷歌浏览器支持的。
方法一、用一张png或者jpg图来代替,提示用户无法展示图片
// 替换文章详情内容里的图片
let content = res.content
if (!supportWebp) {
content = content.replace(/src.*?.webp\"/g, 'src=' + ‘你要替换的图片地址’)
}
$content.html(content)
// 判断是否支持webp格式图片 支持 返回true 不支持 返回false
function check_support_webp() {
const isSupportWebp = document.createElement('canvas').toDataURL('image/webp').indexOf('data:image/webp') === 0;
console.info(isSupportWebp)
return isSupportWebp
}
备注:check_support_webp()方法是我在别人的文章看到的,找不到地址了,抱歉。