是为了更好的记忆而写的。方案一：form表单上传这种方案优点是支持好，缺点是刷新页面。原理：enctype是form上传文件的重点。值描述application/x-www-form-urlencoded默认值。在发送之前对所有字符进行编码（将空格转换为“+”符号，将特殊字符转换为ASCIIHEX值）multipart/form-data不对字符进行编码。当使用带有文件上传控件的表单时，此值是必需的。text/plain将空格转换为“+”符号，但不对特殊字符进行编码。方案二：form表单上传-优化方案一缺点这个方案的优点也是支持好，缺点是不支持跨域。原理：通过target将response指向一个iframe页面，然后获取返回的数据。值说明_blank在新窗口/选项卡中打开_self默认，在同一框架中打开_parent在父框架中打开。_top在整个窗口中打开framename，在指定的iframe中打开。方案三：ajax上传-优化方案二、该方案的缺点兼容性问题-caniuse，兼容性有两个方向。一是低版本ie不支持跨域CORS，二是输入新增的Files。优点是异步、进度条、判断大小、处理、跨域。varfile=input.files[0];varxhr=newXMLHttpRequest();if(xhr.upload){xhr.upload.addEventListener("progress",function(e){console.log(file,e.loaded,e.total);},false);//文件上传成功或失败xhr.onreadystatechange=function(e){if(xhr.readyState==4){if(xhr.status==200){console.log('success',xhr.responseText)}else{console.log('failure')}}}//开始上传xhr.open("POST",'url',true);xhr.send(file);}方案四：ajax-formData上传-多字段多文件；这个方案和上面基本一样，只是使用了FormData，缺点是兼容formDatavarformData=newFormData();formData.append('file',input.files[0]);xhr.send(formData);其他解决方案：1.SWFuploadFlash上??传2.jquery.form.js其他插件上传需求1：使用drop事件拖拽上传，获取e.dataTransferdocument.querySelector('body')。addEventListener("drop",(e)=>{e.preventDefault();//不写就打开console.log(e.dataTransfer.files[0])});需求2：screenshot-paste-uploadusingpasteevent,gete.clipboardDatadocument.querySelector('body').addEventListener("paste",(e)=>{e.preventDefault();//不写就打开console.log(e.clipboardData.files[0])});需求三：base64转换上传的场景发生在与客户端交互的时候。客户端选择的图片返回一个base64给我。这个我上传吧，界面没变，所以文件代码要写的比较啰嗦，其实我不需要那么多东西。atob、Blob、ArrayBuffer是我第一次接触，所以就这样写了。函数(数据){var_str=atob(data.base64Str)var_filePath=((data.filePath.match(/.(jpg|jpeg|png|bmp)$/)||[])[1]||'png').toLowerCase();var_filePathHash={jpg:'image/jpeg',jpeg:'image/jpeg',png:'image/png',bmp:'application/x-bmp',}varpre='------------------------1\r\nContent-Disposition:form-data;名称=“文件”；filename="1.png"\r\n内容类型：'+_filePathHash[_filePath]+'\r\n\r\n';varend='\r\n------------------------1--';varbuffer=newArrayBuffer(_str.length);varuint8=newUint8Array(缓冲区);for(variin_str){uint8[i]=_str.charCodeAt(i);}varblob=newBlob([pre,uint8,end],{type:_filePathHash[_filePath]});varoReq=newXMLHttpRequest();oReq.open("POST","url",true);oReq.setRequestHeader("Content-Type","multipart/form-data;boundary=------------------------1")oReq.onreadystatechange=function(){if(oReq.readyState==4&&oReq.status==200){console.log(oReq.responseText);}oReq.send(blob);需求4一般来说，上传需要写样式。不能说默认的输入样式就可以了，但是，样式就没那么好写了，怎么办？解决方案1??label标签的for触发了input的点击，这样不行吗？input的style不好写，先隐藏起来，给label写个stylescheme。第二个input[type=file]左边是一个input，右边是一个button。其实按钮的样式是不容易改变的，所以我们在上面包裹了一层overlfow:hidden，然后给input设置一个最大值，让里面的所有不同的东西都超出了，这样就可以了可以更改的区域可以更改
