本文通过真实的demo演示案例给大家展示如何使用JS获取本地音乐文件的封面图、文件名及时长等信息。
文章关键字 ‘File’
不使用file类型input也能触发文件上传
2021年08月22日,星期日介绍全新的File System Access API,也就是文件系统访问API,可以无需专门的 HTML 文件选择控件,纯 JS 代码就可以触发本地文件的选择,支持文件类型的指定,有demo,有代码示意,可以进来了解下。
直接剪切板粘贴上传图片的前端JS实现
2018年09月21日,星期五可能有小伙伴并不知道,在网页中,我们直接Ctrl+V也是能够上传图片的。诶?真有这么厉害?没错,就是这么厉害!要不进去瞅瞅,现成的源代码,高保真的demo,包你分分钟学会这种姿势,哦,不,知识!
纯前端实现可传图可字幕台词定制的GIF表情生成器
2018年05月4日,星期五这两天晚上在家自己做了个可以传图,可以写台词的GIF表情图生成器。可以使用提供的模板,也可以自己传图制作,关键是纯前端实现的,这个有点厉害了,有兴趣可以进来看看。
小tips: 纯前端JS读取与解析本地文本类文件
2018年03月27日,星期二所谓文本类文件,指MIME Type为text/*文件,例如,CSS文件(text/stylesheet),JS文件(text/javascript),HTML文件(text/html),txt文本(text/plain)等等。
在现代浏览器下,我们可以直接对这些文件进行处理,无论是通过type=file表单元素还是从桌面拖拽到网页中都是可以的……
HTML5 file API加canvas实现图片前端JS压缩并上传
2017年07月30日,星期日很多网站的图片上传功能都会对图片的大小进行限制,尤其是头像上传,限制5M或者2M以内是非常常见的。然后现在的数码设备拍摄功能都非常出众,一张原始图片超过2M几乎是标配,此时如果用户想把手机或相机中的某个得意图片上传作为自己的头像,就会遇到因为图片大小限制而不能上传的窘境,不得不对图片进行再处理,而这种体验其实非常不好的。如果可以在前端进行压缩,就不会有这种尺寸限制的问题,自然用户体验就可以大大提升,非常具有价值!
HTML input type=file文件选择表单元素二三事
2015年11月24日,星期二本文一些简单tips整理,没有深入具体的技术细节。考虑到一些童鞋的HTML基础不是很扎实,因此,本文的一些内容说不定可以博闻强识下。有截图有源代码展示,没demo,嘻嘻……
XMLHttpRequest实现HTTP协议下文件上传断点续传
2013年11月5日,星期二理解DOMString、Document、FormData、Blob、File、ArrayBuffer数据类型
2013年10月14日,星期一我大学那会儿,一个称为Ajax的东西对前端行业造成了深远影响,不仅是JS语言,而包括前端地位、职位兴起以及工作分工等。抛开IE6浏览器不谈,其他浏览器的Ajax实际上都是借助XMLHttpRequest实现的。 然后,好多年过去了,XMLHttpRequest带着两位家臣,DOMString和Document数据类型攻城略地,几乎一统天下。 然时代是发展的,人们群众的需求是旺盛的,HTML5犹如冉冉升起的新星开始普照大地,恩泽大众。XMLHttpRequest由于就两个家臣DOMString和Document,且并不是100%听话。因此,其已经开始hold不住HTML5的耀眼光芒了。为了顺应时代的潮流,XMLHttpRequest凹凸曼变身升级到2.0,变化诸多,其中一个很重要的变化就是广招家臣,扩张实力,与HTML5一起完成千秋万载之大业。 这些家臣有……