javascript 判断字符串是否是图片路径

Question

javascript 判断字符串是否是图片路径？

我有一个不确定的字符串：有可能是： http://www.baidu.com （代表url地址路径）
也有可能是:http://www.xxxx/xxx/abc.png （代表图片）

怎么才能判断这个字符串是否是图片？

Answer 1

url.split('.')[1]=='png'||url.split('.')[1]=='jpg'

其他图片自己加

Answer 2

想到webpack对于图片的打包有感。
正则

图片正则
const PICTURE_EXPRESSION = /\.(png|jpe?g|gif|svg)(\?.*)?$/
const picReg = new RegExp (PICTURE_EXPRESSION)
url正则
const URL_REGULAR_EXPRESSION = /http(s)?:\/\/([\w-]+\.)+[\w-]+(\/[\w- .\/?%&=]*)?/
const objExp = new RegExp(URL_REGULAR_EXPRESSION)
进行你的判断吧~

Answer 3

1、正则匹配url后缀名，简单，适用性差，答案楼上都是；
2、监听img的error事件，不管后缀名什么样，只要url放在img的src里能加载成功就算，适用性强；

let strArr = [
  "http://www.baidu.com",
  "https://static.segmentfault.com/v-5ab0701d/global/img/social-icons/icon-sn.svg",
  "https://sfault-avatar.b0.upaiyun.com/151/837/1518375183-54f135ef0d731_small"
];

function getPromises(src) {
  let img = document.createElement("img");
  img.src = src;
  return new Promise(function(resolve, reject) {
    img.onerror = () => {
      resolve(undefined);
    };
    img.onload = () => {
      resolve(src);
    };
  });
}

Promise.all(strArr.map(src => getPromises(src))).then(data => {
  console.log(data);
  //  [
  //   undefined,
  //   "https://static.segmentfault.com/v-5ab0701d/global/img/social-icons/icon-sn.svg",
  //   "https://sfault-avatar.b0.upaiyun.com/151/837/1518375183-54f135ef0d731_small"
  // ];
});

这里就把不能作为img的src的url置为undefined

Answer 4

唉，直接截取格式进行判断阿

var url = 'http://www.baidu.com ';
var sub = url.substring(url.length-1,url.lastIndexOf('.'));
if(sub === '.com' || sub === '.cn'){
console.log('是的，这个是网址')
}else{
console.log('是的，这个是图片')
}

Answer 5

好像不是图片路径的也可以是图片。对于网址来说图片只是一种输出方式。和路径无关吧

Answer 6

写了一个正则，这个应该不错：

function check_is_img(url) {
  return (url.match(/\.(jpeg|jpg|gif|png)$/) != null)
}

Answer 7

const url = 'http://www.xxxx/xxx/abc.png';

if(/.(png|jpg|jpeg|gif)$/g.test(url)) {
    //为图片
} else {
    //不是图片
}