JS 獲取文件后綴,判斷文件類型(比如是否為圖片格式)
1、獲取文件后綴
有時候我們需要通過文件名或者路徑,得到該文件的后綴名(擴展名),可以通過如下方式進行截取:
//文件路徑
var filePath = "file://upload/jb51.png";
//獲取最后一個.的位置
var index= filePath.lastIndexOf(".");
//獲取后綴
var ext = filePath.substr(index+1);
//輸出結(jié)果
console.log(ext);
效果圖如下:

2、文件類型判斷
我們得到文件后綴名后,根據(jù)后綴即可判斷文件的類型(文件格式)。比如我們需要判斷一個文件是否是圖片格式,首先定義一個判斷函數(shù):
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、第三種實現(xiàn)方式,今天腳本之家小編剛get到的新技能
<script>
//文件路徑
var fileName = "file://upload/jb51.png";
var Ttype="";
//后綴獲取
let suffix = '';
// 獲取類型結(jié)果
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的箭頭函數(shù)
相關(guān)文章
多個jquery.datatable共存,checkbox全選異常的快速解決方法
這篇文章主要介紹了多個jquery.datatable共存,checkbox全選異常的快速解決方法。需要的朋友可以過來參考下,希望對大家有所幫助2013-12-12
bootstrap weebox 支持ajax的模態(tài)彈出框
本篇介紹的bootstrap weebox(支持ajax的模態(tài)彈出框),歷經(jīng)多次修改,目前版本已經(jīng)穩(wěn)定,整合了bootstrap的響應(yīng)式,界面簡單,功能卻無比豐富,支持ajax、圖片預(yù)覽等等2017-02-02
JavaScript數(shù)組方法之findIndex()的用法詳解
findIndex()方法是一個非常實用的數(shù)組方法,可以幫助我們快速查找符合某個條件的元素,本文給大家介紹JavaScript數(shù)組方法之findIndex()的用法,感謝的朋友跟隨小編一起看看吧2023-10-10
Bootstrap carousel輪轉(zhuǎn)圖的使用實例詳解
圖片輪播效果在Web中常常能看到,很多人也稱之為幻燈片。這篇文章主要給大家介紹Bootstrap carousel輪轉(zhuǎn)圖的使用實例詳解,需要的朋友可以參考下2016-05-05
json前后端數(shù)據(jù)交互相關(guān)代碼
本篇文章給大家分享了關(guān)于json前后端數(shù)據(jù)交互方法實現(xiàn)的相關(guān)知識點內(nèi)容,有興趣的讀者們可以參考學習下。2018-09-09

