-
语义化
- 概念: 用正确的标签做正确的事情, 相较于全用div, 页面头部标签使用header, 导航使用nav, 主要区域使用main, 侧边使用aside, 底部使用footer.
- 优点:
- 对机器友好: 有利于搜索引擎爬取
- 对开发者友好: 增强了代码可读性,能清晰看出页面的结构, 便于开发与维护
-
DOCTYPE(⽂档类型) 的作⽤
- 概念: HTML的文档类型声明
- 用处: 告诉浏览器应该以什么样的文档类型来解析, 如html或xhtml
-
meta 标签
- 概念: 描述网页文档的属性, 属性由name和content来定义
- 常用:
- HTML文档的编码类型: charset="UTF-8"
- 适配移动端: name=viewport content="width=device-width, ...."
-
script中的defer和async区别
- 出现场景: HTML页面加载碰到script脚本的时候, 会先加载完脚本, 然后加载后续的页面, 这样会导致两个问题:
- 阻塞页面: 脚本加载完之前看不到后续页面,一直在这等待
- 脚本无法访问到他后面的元素,即无法给他们添加处理程序
- defer和async
- 相同点: 异步加载, 不阻塞页面
- 不同点: defer是在DOMContentLoaded(指浏览器已完全加载 HTML,并构建了DOM树)之前完成.async是一个完全独立的脚本, 与其他脚本以及DOMContentLoaded不会彼此等待.
- 出现场景: HTML页面加载碰到script脚本的时候, 会先加载完脚本, 然后加载后续的页面, 这样会导致两个问题:
-
HTML5的一些新特性
- 语义化标签: 如header, nav, footer, section, aside, main等.
- audio: 音频
- controls: 控制面板
- autoplay: 自动播放
- loop='true' 循环播放
<audio src='' controls autoplay loop='true'></audio> - web存储
- localstorage
- sessionStorage