js获取文件名或文件后缀名(扩展名)的几种方法

这篇具有很好参考价值的文章主要介绍了js获取文件名或文件后缀名(扩展名)的几种方法。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

有时候我们需要通过含有文件名和后缀名的一个字符串中提取出该文件的文件名或文件后缀名(扩展名),可以通过如下几种方式进行截取。

例如文件名为: var fileName="12345.txt";

方式一:subtring()

用法参考博文 【js截取字符串subString()方法】 js截取字符串subString()方法_js 如何使用substring()截取字符串?-CSDN博客

使用subtring() 截取字符串,对于文件名中会出现多个点的很有用,从最后一个点的地方截取。

源代码

var fileName="12345.txt";

// 获取后缀名和点
var suffix = fileName.substring(fileName.lastIndexOf("."));//.txt
console.log(suffix)

// 只获取后缀名
var suffixName = fileName.substring(fileName.lastIndexOf(".")+1);//txt
console.log(suffixName)

// 获取文件名
var name = fileName.substring(0, fileName.lastIndexOf("."));//12345
console.log(name)

运行结果

js 获取文件名,前端(html+css+js)知识点杂烩,javascript,前端,开发语言

方式二:substr()

同subtring()的字符串截取

源代码

var fileName="12345.txt";

// 获取后缀名和点
var suffix = fileName.substr(fileName.lastIndexOf("."));//.txt
console.log(suffix)

// 只获取后缀名
var suffixName = fileName.substr(fileName.lastIndexOf(".")+1);//txt
console.log(suffixName)

// 获取文件名
var name = fileName.substr(0, fileName.lastIndexOf("."));//12345
console.log(name)

运行结果

js 获取文件名,前端(html+css+js)知识点杂烩,javascript,前端,开发语言

方式三:正则

使用正则,对只会出现一个点的适用:

源代码

var fileName="12345.txt";

// 获取后缀名和点
var suffix = fileName.match(/.[^.]+$/)[0];//.txt
console.log(suffix)

// 只获取后缀名
var suffixName = fileName.match(/[^.]+$/)[0];//txt
console.log(suffixName)

// 获取文件名
var name = fileName.match(/^[^.]+/)[0];//12345
console.log(name)

运行结果

js 获取文件名,前端(html+css+js)知识点杂烩,javascript,前端,开发语言

当文件名中出现2个点的情况下,会出现异常

源代码

var fileName="12345.txt.zip";

// 获取后缀名和点
var suffix = fileName.match(/.[^.]+$/)[0];//.zip
console.log(suffix)

// 只获取后缀名
var suffixName = fileName.match(/[^.]+$/)[0];//zip
console.log(suffixName)

// 获取文件名
var name = fileName.match(/^[^.]+/)[0];//12345
console.log(name)

运行结果

js 获取文件名,前端(html+css+js)知识点杂烩,javascript,前端,开发语言

方式四:转数组

数组方法可以参考博文 【js数组和字符串之间的转换方式以及数组的一些方法】: js数组和字符串之间的转换方式以及数组的一些方法-CSDN博客

对只会出现一个点的适用:

源代码

var fileName="12345.txt";

// 获取后缀名和点
var suffix = '.'+fileName.split('.').pop();//.txt
console.log(suffix)

// 只获取后缀名
var suffixName = fileName.split('.').pop();//txt
console.log(suffixName)

// 获取文件名
var name = fileName.split('.').shift();//12345
console.log(name)

运行结果

js 获取文件名,前端(html+css+js)知识点杂烩,javascript,前端,开发语言

当文件名中出现2个点的情况下,会出现异常

源代码

var fileName="12345.txt.zip";

// 获取后缀名和点
var suffix = '.'+fileName.split('.').pop();//.zip
console.log(suffix)

// 只获取后缀名
var suffixName = fileName.split('.').pop();//zip
console.log(suffixName)

// 获取文件名
var name = fileName.split('.').shift();//12345
console.log(name)

运行结果

js 获取文件名,前端(html+css+js)知识点杂烩,javascript,前端,开发语言文章来源地址https://www.toymoban.com/news/detail-852950.html

到了这里,关于js获取文件名或文件后缀名(扩展名)的几种方法的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包