JS 获取文件后缀，判断文件类型(比如是否为图片格式)

1、获取文件后缀

有时候我们需要通过文件名或者路径，得到该文件的后缀名（扩展名），可以通过如下方式进行截取：

//文件路径
var filePath = "file://upload/jb51.png";
//获取最后一个.的位置
var index= filePath.lastIndexOf(".");
//获取后缀
var ext = filePath.substr(index+1);
//输出结果
console.log(ext);

效果图如下：

2、文件类型判断

我们得到文件后缀名后，根据后缀即可判断文件的类型（文件格式）。比如我们需要判断一个文件是否是图片格式，首先定义一个判断函数：

function isAssetTypeAnImage(ext) {
 return [
 'png', 'jpg', 'jpeg', 'bmp', 'gif', 'webp', 'psd', 'svg', 'tiff'].
 indexOf(ext.toLowerCase()) !== -1;
}

使用时只需把后缀传入即可判断：

//文件路径
var filePath = "file://upload/jb51.png";
//获取最后一个.的位置
var index= filePath.lastIndexOf(".");
//获取后缀
var ext = filePath.substr(index+1);
//判断是否是图片
console.log("该文件是否为图片：" + isAssetTypeAnImage(ext));

效果图如下：

3、第三种实现方式，今天我们小编刚get到的新技能

<script>
//文件路径
var fileName = "file://upload/jb51.png";
var Ttype="";
//后缀获取
let suffix = '';
// 获取类型结果
let result = '';
const flieArr = fileName.split('.');
suffix = flieArr[flieArr.length - 1];
if(suffix!=""){
suffix = suffix.toLocaleLowerCase();
// 图片格式
const imglist = ['png', 'jpg', 'jpeg', 'bmp', 'gif'];
// 进行图片匹配
result = imglist.find(item => item === suffix);
if (result) {
  Ttype='image';
}
}
console.log("该文件是否为图片：" + Ttype);
</script>

使用es6的箭头函数

赞 (0)

相关推荐

  • js获取判断上传文件后缀名的示例代码

    复制代码 代码如下: function lastname(){ //获取欲上传的文件路径var filepath = document.getElementById("file1").value; //为了避免转义反斜杠出问题,这里将对其进行转换var re = /(\\+)/g; var filename=filepath.replace(re,"#");//对路径字符串进行剪切截取var one=filename.split("#");//获

  • js根据后缀判断文件文件类型的代码

    核心代码 <script> function getFileType(fileName) { // 后缀获取 let suffix = ''; // 获取类型结果 let result = ''; try { const flieArr = fileName.split('.'); suffix = flieArr[flieArr.length - 1]; } catch (err) { suffix = ''; } // fileName无后缀返回 false if (!suffix) {

  • js实现浏览本地文件并显示扩展名的方法

    js实现浏览本地文件并显示扩展名的方法

    本文实例讲述了js实现浏览本地文件并显示扩展名的方法.分享给大家供大家参考.具体如下: 这里用文件域浏览指定文件,可以显示该文件的扩展名,想想它可以用在哪里?可以用在文件上传系统上,用来判断上传的文件类型是否是合法类型,不是则不允许上传.再看看代码,不足10行,解决问题,正在学习javaScript的朋友,你也可参考参考哦. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-view-nav-file-ext-codes/ 具体代码如下: <

  • javascript 得到文件后缀名的思路及实现

    对于一个带绝对路径的文件名如:D:\Program Files\Notepad++\Notepad++.exe首先为了避免转义反斜杠出问题,可以用正则表达式来将\或\\替换成#,如:D:#Program Files#Notepad++#Notepad++.exe之后以'#'为分隔符,将字符串分解成数组,得到如下数组:D:  ProgramFiles  Notepad++  Notepad++.exe取数组的最后一个即为带后缀的文件名:Notepad++.exe再以'.'为分隔符,将这个带后缀的文

  • js 得到文件后缀(通过正则实现)

    正则得到后缀 复制代码 代码如下: <script type="text/javascript"> function validate(){ //var importUrl= $("#importurl").val(); var importUrl="test.xlsx"; var d=/\.[^\.]+$/.exec(importUrl); alert(d); return false; } </script>

  • 后缀就扩展名为js的文件是什么文件 原创

    好多朋友刚开始接触网络,不懂后缀为js的文件,是什么文件,其实这个扩展名为.js的文件就是javascript文件,为什么要用<script src="test.js"></script>的格式来调用文件呢,其实我们经常在做网页过程中,因为js文件如果写到网页中,不利于我们的反复修改,如果以后我们需要修改js文件的话,就可以直接改js文件,不需要改整个网页,现在大家的网站都是生成静态的html,如果要修改成千上万的个静态页面,不论是替换还是从节约网站空间,都是不

  • Node.js中.pfx后缀文件的处理方法

    前言 nodejs中,在做加密解密的时候,会得到第三方的各种各样的加密文件,其后缀也就那么几种吧,.key/.pem/.pfx等,是不是可以自定义,反正就是一个文件. 但是今天我看了很多的nodejs库好像也没有找到与java keytool这样的工具,因为在java里面,完全是可以读取pfx,然户进行在进行处理的,如果在nodejs中要如何操作,目前不知道,使用openssl做个转换处理先. 第一个命令是: openssl pkcs12 -in xxxx.pfx -nocerts -nodes

  • js判断上传文件后缀名是否合法

    js判断上传文件后缀名是否合法

    本文实例介绍了js判断上传文件后缀名是否合法的详细代码,分享给大家供大家参考,具体内容如下 效果图: 选择文件 选择1.jpg文件 上传成功合法 除图片文件格式以外,其他都是不合法的操作. 具体代码: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>判断文件上传是否合法</tit

  • 改变JSP的文件后缀

    今天闲来无事,突然想到一个问题,能不能把访问JSP文件的后缀换成我自己的后缀呢?经过自己的一些调试,终于成功啦.哈哈哈. 好高兴.....    首先,在WEB.XM里配置  <servlet>    <servlet-name>testsuffix</servlet-name>    <servlet-class>mytest.TestSuffix</servlet-class>  </servlet>  <servlet-m

  • 上传的js验证(图片/文件的扩展名)

    js 验证上传图片 复制代码 代码如下: var ImgObj=new Image();//建立一个图像对象 varAllImgExt=".jpg|.jpeg|.gif|.bmp|.png|"//全部图片格式类型 varFileObj,ImgFileSize,ImgWidth,ImgHeight,FileExt,ErrMsg,FileMsg,IsImg//全局变量图片相关属性 //以下为限制变量 var AllowExt=""; //允许上传的文件类型ŀ为无限制每个

随机推荐