前言
前端选择文件时，都会使用 input 框设定 type="file" 来选择文件，默认情况下可以选择所有类型的文件，有时候需要限定选择的文件类型，这时候就用到了 accept 属性。
ps：accept 属性仅适用于 <input type="file"/>
accept 各种类型
| 文件类型 | accept 属性值（多个值之间以逗号隔开） |
|---|---|
| .3gpp | audio/3gpp, video/3gpp |
| .ac3 | audio/ac3 |
| .asf | allpication/vnd.ms-asf |
| .au | audio/basic |
| .css | text/css |
| .csv | text/csv |
| .doc | application/msword |
| .docx | application/vnd.openxmlformats-officedocument.wordprocessingml.document |
| .dot | application/msword |
| .dotx | application/vnd.openxmlformats-officedocument.wordprocessingml.template |
| .docm | application/vnd.ms-word.document.macroEnabled.12 |
| .dotm | application/vnd.ms-word.template.macroEnabled.12 |
| .dtd | application/xml-dtd |
| .dwg | image/vnd.dwg |
| .dxf | image/vnd.dxf |
| .gif | image/gif |
| .htm | text/html |
| .html | text/html |
| .jp2 | image/jp2 |
| .jpe | image/jpeg |
| .jpeg | image/jpeg |
| .jpg | image/jpeg |
| .js | text/javascript, application/javascript |
| .json | application/json |
| .mp2 | audio/mpeg, video/mpeg |
| .mp3 | audio/mpeg |
| .mp4 | audio/mp4, video/mp4 |
| .mpeg | video/mpeg |
| .mpg | video/mpeg |
| .mpp | application/vnd.ms-project |
| .ogg | application/ogg, audio/ogg |
| application/pdf | |
| .png | image/png |
| .pot | application/vnd.ms-powerpoint |
| .potm | application/vnd.ms-powerpoint.presentation.macroEnabled.12 |
| .potx | application/vnd.openxmlformats-officedocument.presentationml.template |
| .pps | application/vnd.ms-powerpoint |
| .ppsm | application/vnd.ms-powerpoint.slideshow.macroEnabled.12 |
| .ppsx | application/vnd.openxmlformats-officedocument.presentationml.slideshow |
| .ppt | application/vnd.ms-powerpoint |
| .pptm | application/vnd.ms-powerpoint.presentation.macroEnabled.12 |
| .pptx | application/vnd.openxmlformats-officedocument.presentationml.presentation |
| .ppa | application/vnd.ms-powerpoint |
| .ppam | application/vnd.ms-powerpoint.addin.macroEnabled.12 |
| .rtf | application/rtf, text/rtf |
| .svf | image/vnd.svf |
| .tif | image/tiff |
| .tiff | image/tiff |
| .txt | text/plain |
| .wdb | application/vnd.ms-works |
| .wps | application/vnd.ms-works |
| .xhtml | application/xhtml+xml |
| .xlc | application/vnd.ms-excel |
| .xlm | application/vnd.ms-excel |
| .xla | application/vnd.ms-excel |
| .xlam | application/vnd.ms-excel.addin.macroEnabled.12 |
| .xls | application/vnd.ms-excel |
| .xlsx | application/vnd.openxmlformats-officedocument.spreadsheetml.sheet |
| .xlsm | application/vnd.ms-excel.sheet.macroEnabled.12 |
| .xlsb | application/vnd.ms-excel.sheet.binary.macroEnabled.12 |
| .xlt | application/vnd.ms-excel |
| .xltx | application/vnd.openxmlformats-officedocument.spreadsheetml.template |
| .xltm | application/vnd.ms-excel.template.macroEnabled.12 |
| .xlw | application/vnd.ms-excel |
| .xml | text/xml, application/xml |
| .zip | application/zipapplication/x-zip-compressed |
当然，也可以使用 * 指定所有的文件类型，比如：“*” 指定所有文件类型；“image/*” 指定所有图片类型；“audio/*” 或 “video/*” 指定所有视频类型。
用法
<input type="file" accept="image/*,video/*" />