2026前端HTML5面试题

以下是本人呕心沥血总结的前端HTML5面试题希望对大家有所帮助。01.说一下对语义化的理解对开发者友好让人更容易读懂利于代码可读性对机器友好让搜索引擎更容易读懂利于seo。02.说一下HTML5有哪些更新/新增新增语义化标签音频视频标签新增localstoragesessionstorage本地存储新增DOM查询 document.querySelector() 、 document.querySelectorAll()。03.说一下defer和async的区别多个带defer的script标签里js同步执行async是异步执行defer等所有元素解析完成之后DOMContentLoaded之前执行。04.说一下iframe有哪些优点和缺点优点展现嵌入的网页加载速度较慢的内容如广告可以跨子域通信缺点iframe会阻塞主页面onload事件不利于搜索引擎识别增加http请求。05.说一下web worker?Web Worker 的作用就是为 JavaScript 创造多线程环境允许主线程创建 Worker 线程将一些任务分配给后者运行。Worker 线程一旦新建成功就会始终运行不会被主线程上的活动比如用户点击按钮、提交表单打断。这样有利于随时响应主线程的通信。但是这也造成了 Worker 比较耗费资源不应该过度使用而且一旦使用完毕就应该关闭。通过postMessage将结果回传到主线程这样复杂操作的时候就不会阻塞主进程了。06.行内块级空元素替换元素有哪些行内buttonspan块级divpulh1替换元素imgiframevideo空元素linkmeta07.DOCTYPE的作用严格模式和混杂模式的区别DOCTYPE告诉浏览器以HTML5标准解析页面如果不写则进入混杂模式。严格模式标准模式以w3c标准解析代码混杂模式怪异模式浏览器用自己的方式解析代码混杂模式通常模拟老式浏览器的行为以防止老站点无法工作。08.说一下渐进增强和优雅降级的区别渐进增强是针对低版本浏览器也能保证基础功能然后对高级浏览器改进追加功能优雅降级是一开始构建完整功能再对低版本进行兼容。09.说一下怎么做好seo1语义化元素2title和meta标签描述页面内容3logo使用a标签加背景图。10.说一下b和strongi和em的区别strong是有语义的起到加强语气的效果遇到阅读器会重读即为了强调而加粗em起到强调文本的作用。11.说一下img的srcset作用alt和title的区别?响应式页面中经常用到根据屏幕密度设置不同的图片。这时就用到了 img 标签的srcset属性。srcset属性用于设置不同屏幕密度下img 会自动加载不同的图片。alt是图片失效的时候的备用图片地址title是图片标题。12.说一下canvas和svg的区别canvas是画布适合图形密集型的游戏不支持事件处理svg是矢量图不依赖分辨率不适合游戏适合大型渲染区域地图支持事件处理。好啦以上总结的是一些基础的HTML5的面试题希望对各位小伙伴有所帮助后续还会有更多的面试干货关注我持续更新哦。需要更多资源和咨询的请添加下方老师微信