HTML 问题Label标签的作用？Html如何上传文件？HTML5新特性？MVC与MVVM的理解？commonjs规范、ES6 module、AMD、CMD？答案Label标签的作用Label标签一般和input配合使用，当用户点击label标签内容的时候会自动聚焦到和该标签关联的控件上。在input里加上id的属性，label里加for的属性进行连接。就能够点击字体勾选勾选框了Html上传文件将input中的type指定为file就可以上传文件了,上传多文件的话需要在给标签添加multiple。要读取file对象的话需要监听change事件。首先document.getElementByid(‘xx’)获取实例，然后给其添加监听addEventListener(‘change’,(event) => { const files = event.target.files}; log(‘files’,files))语义化标签Header 头部 main主体 nav代表超链接区域 article 可以表示文章、博客等内容 section章节页眉等区域 asdie通常表示侧边栏或者嵌入内容 footer 尾部语义化的优点代码结构清晰，便于维护。 方便其他设备解析。 有利于搜索引擎优化，爬虫会根据不同标签赋予不同权重增强型表单邮箱类型、数值范围、文件导入、图片按钮、颜色选择、日期选择、搜索框、手机号输入框、网址输入框 新增表单元素datalist下拉框(option是选项) progress进度条(设置value控制) meter刻度值新的表单属性 placeholder-默认显示 required-输入框不能为空 aotufocus-自动聚焦 autocomplete-提示写过的信息，默认on，且必须有name属性。Email默认off patten属性，校验正则匹配是否通过minlength和max视频和音频（共同的有src,controls,autoplay,loop）--好像都是共同的Video 方法play()pause()load()加载 属性width,height,controls像素或者宽高，播放条（写上就有播放条了） document.getElementsById(“”)Audio 方法类似 属性autoplay(true) controls() loop()循环播放 muted()静音播放 poster()音频封面Canvas画图和svg绘图Canvas是选定一个区域做画布，然后通过js动态的在这个区域中绘图Svg基于xml可以操作dom，渲染速度慢Svg不容易失帧，更加稳定，容易编程Svg每个形状被当作一个对象，canvas是一像素一像素的进行渲染，两者改变都会重绘地理位置 必须得到用户允许GetCurrentPositon()方法获取定位 可以实现位置距离的计算拖放APIDraggable 为true时开启拖放拖放事件原对象：dragstart 开始拖放 drag拖放中 dragend 拖放结束过程对象：dragenter 源对象开始进入过程对象范围内 dragover 在过程对象范围内移动Dragleave 源对象离开过程对象WebworkerJs是单线程任务，一次只能做一件事。单线程无法发挥cpu优势并且速度较慢阻塞浏览器执行，Webworker会为js创建多线程环境，js在主线程执行，new一个子线程在后台执行，完成计算后会返回给主线程，提高效率。缺点：兼容性不高Webworker的限制1 必须同源 2 dom限制，因为是在子线程，所以无法读取window，parent等主线程页面中的dom对象 3 主线程和子线程无法直接通信，不在一个环境 4 不能alert和conform但是可以使用XMLhttprequest对象发出ajax请求 5 子线程不能读取本地文件，加载的脚本必须来源于网络XMLhttprequest？用户在后台和服务器交换数据的对象XMLhttprequest功能？不重新加载页面就可以获取数据，在页面加载后从服务器请求数据WebstroageLocalstroage和sessionstroage方法 setItem(key,value) getItem(key) clear() removeItem(key)WebSocket是客户端和服务端数据交换的方式，允许服务端主动向客户端推送数据，并且只需要握手一次，就可以创建持久性的连接进行双向数据传输。是浏览器通过js给服务器发送建立WebSocket的请求，连接建立后就可以通过tcp连接直接交换数据。属性:WebSocket.readyState(连接状态) 0未连接1连接建立可以通信2连接正在关闭3关闭了WebSocket事件:Socket.onopen Socket.onmessage Socket.onerror Socket.onclose 分别是连接建立的时候触发，客户端收到服务端数据的时候触发，通信错误触发，关闭的时候触发方法:Socket.send()使用连接发送数据 Socket.close() 关闭连接Commonjs规范Commonjs规范加载模块是同步的，只有加载完成，才能执行后面的操作Module--每个文件就是一个模块，有自己的作用域。Module代表当前模块，是一个对象。Export--该属性是对外输出的接口，其他文件加载该模块就是读取module.exports变量Require--用于加载模块文件导入用require，导出用module.exports，导出的对象需要注意如果是静态的且非常量，后期可能会改动的，要使用函数动态获取。导入的参数可以随意修改module.exports = exports = {} 导出的对象Es6 module和Commonjs module区别导入导出不同，Commonjs使用exports和require es6使用import和export因为Commonjs的require是同步的，所以Commonjs模块规范只适合在服务端，es6无论浏览器还是服务端都可以Commonjs模块输出的是一个值的拷贝，会对加载结果进行缓存，内部再修改这个值则不会同步到外部。es6模块输出的是值的引用(拷贝不同于引用)Commonjs模块是加载时执行，es6是输出接口，使得能够对js模块进行静态分析Commonjs遇到循环依赖的时候，只输出已经执行的部分，后续的输出不会影响已经输出的变量。Es6使用import加载一个变量，变量不会被缓存，取值的时候直接取到最终值Commonjs顶层，this指向当前模块，es6模块this指向undefinedEs6支持加载Commonjs模块，Commonjs不能加载es6模块Es6 module和Commonjs module循环引用的问题循环加载就是a脚本运行依赖b，b脚本执行也依赖aCommonjs是加载时执行，出现循环加载的话只输出已经执行的部分，没有执行的不会输出。Es6对导出模块，变量，对象都是动态引用，遇到import的时候不去执行模块，只是生成一个指向被加载模块的引用。Commonjs一般用于后端nodejs，前端一般是es6的模块规范Commonjs为什么适用于服务端服务端加载模块直接是从硬盘读取，很快，浏览器的话还需要发请求浏览器如果用Commonjs模式的require加载模块，而这个模块需要http请求服务器去拿，并且因为Commonjs是同步的，所以就比较慢，会阻塞后面代码的运行AMD 异步模块定义指模块和模块的依赖可以异步加载，他们的加载不会影响后面语句的运行。AMD一般指requireJS，通过define将代码定义成模块，通过require实现代码模块加载。优缺点：执行早可以发现错误，异步。执行早浪费资源，开发成本高，麻烦难懂。CMD规范专门用于浏览器端的，模块加载是异步的，模块使用的时候才会执行。优缺点：依赖就近，延迟执行，容易在nodejs中运行。依赖spm打包，模块加载逻辑重。MVC与MVVM的理解MVC 是模型，视图，控制器的缩写，是最常见的软件架构之一。其中M是应用程序中用于管理数据的部分，通常就是从后端传过来的数据。V是管理页面的，控制应用数据显示的部分。C是管理和控制页面和数据的、处理用户交互的，将model的数据渲染到view视图中。MVC是单向通信的，m和c必须通过v来承上启下。MVVM：VM是MVVM模式的核心，连接了M与V，是双向数据绑定的，既能够将数据转换成我们看到的页面，也能将页面的数据转化为后端的数据，实现方式是通过dom的监听，通常是利用ViewModel实现了一个observer观察者，监听数据的变化并及时更新。区别：单向与双向 MVC中的Controller变成了viewModel MVVM通过数据来显示视图层而不是节点操作 MVVM主要解决了MVC中大量的DOM操作，提高了性能