任务4 面试Q&A

HTML、XML、XHTML 有什么区别？

HTML：

• HTML是超文本标记语言 (Hyper Text Markup Language) ，被设计用来显-
  示数据。
• HTML 文档只使用在 HTML 标准中预定义的标签，使用标记标签来描述网页。
• HTML 的语法较为松散，是不严格的 Web 语言。

XML：

• XML 是可扩展标记语言 (EXtensible Markup Language)，被设计用来传输和存储数据。
• XML 是不作为的，仅是纯文本。需要编写能够读懂 XML 的应用程序，才能传送、接收和显示出 XML 文档。
• XML 没有预定义的标签，允许文档编写者自行定义标签和文档结构。
• XML 不会替代 HTML ，它是对 HTML 的补充，是独立于软件和硬件的信息传输工具。

XHTML

• XHTML 指可扩展超文本标签语言（EXtensible HyperText Markup Language）。
• XHTML 的目标是取代 HTML。
• XHTML 与 HTML 4.01 几乎是相同的。
• XHTML 是更严格更纯净的 HTML 版本。
• XHTML 是作为一种 XML 应用被重新定义的 HTML。

怎样理解 HTML 语义化？

• 提高页面可读性，便于开发维护。
• 在正确的地方使用恰当的标签。
• 使页面内容有明显的分布结构。
• 尽量减少使用,,等标签。
• 便于对浏览器、搜索引擎解析，搜索引擎的爬虫依赖于标记来确定上下文和各个关键字的权重，利于 SEO。

怎样理解内容与样式分离的原则？

• 在Web页面中html代表结构，css代表样式，javascript代表行为，所以内内容与样式分离是指在编码过程中将html和css两大部分分离。
• 正确做法是写HTML的时候先不管样式，重点放在HTML的结构和语义化上，让HTML能提现页面结构或者内容,，然后进行 css 样式设置，减少 HTML 与 CSS 契合度（即内容与样式分离） ，写JS的时候，尽量不要用JS去直接操作样式，而是通过给元素添加删除class来控制样式变化（即行为分离）
• 分离的优点：浏览器加载网页页面速度变快。分离原则下，大部分页面代码写在了CSS当中，页面体积容量变得更小。
• 网页修改设计时，效率、省时。根据html标签内ID或class的标记，到CSS里找到相应的ID或class，可以快速替换指定位置的样式，不会破坏页面架构和其他部分的样式。

有哪些常见的meta标签?

• 关键字，页面描述，搜索引擎 SEO:

• 移动端合理显示：
  
• 清除缓存：
  
• 双核浏览器:
  
• 禁止缓存：
  

文档声明的作用 ? 严格模式和混杂模式指什么 ? 的作用 ?

• DOCTYPE (Document Type Declaration 文档类型声明，缩写 DTD)，通常情况下，DOCTYPE 位于一个 HTML 文档的最前面的位置，位于根元素 HTML 的起始标签之前。
  DOCTYPE 声明目的是要告诉浏览器的解析器当前文档的类型，以决定其需要采用的渲染模式。不同的渲染模式会影响到浏览器对于 CSS 代码甚至 JavaScript 脚本的解析。尤其是在 IE 系列浏览器中，由DOCTYPE 所决定的 HTML 页面的渲染模式至关重要。
• 严格模式：页面排版及 JS 解析是以该浏览器支持的最高标准来执行。
• 混杂模式：页面以宽松的向后兼容的方式显示，模拟老式浏览器的行为以防止站点无法工作。
• HTML 5 不基于 SGML (标准通用语言)，因此不需要对 DTD (文档类型声明) 进行引用，但需要 DOCTYPE 来规范浏览器的行为，让浏览器按照 W3C 的标准来解析渲染页面。
  而 HTML 4.01 基于SGML，所以需要对 DTD 进行引用，才能告知浏览器的解析器当前文档的类型。

浏览器乱码的原因是什么？如何解决

• 浏览器出现乱码的原因是文档保存的编码格式和浏览器解析时的解码格式不匹配，一般是英文以外的字符才会出现乱码。若文档中未用 指明编码方式，将使用编辑器默认的编码方式进行保存，例如vscode编辑器，默认的编码方式是utf-8 。

• 解决之法：在 HTML 页面的里添加来声明编码格式。如无权限修改 HTML 文件，则可以尝试手动设置浏览器的编码格式。

常见的浏览器有哪些，什么内核？

浏览器	内核
Firefox	gecko
IE	trident
Chrome	Blink
Opera	Blink
国内主流双核浏览器	trident + Blink
Safari	webkit

列出常见的标签，并简单介绍这些标签用在什么场景?

，

标签	应用场景
h1~h6	定义一个标题
p	定义一个段落
a	定义一个链接或作为锚点
img	引入一张图片
strong	强调加粗
span	无具体语义多作为行内单独设置样式使用
div	块级标签无具体语义多作为划分区块使文档独立
ul,li	无序列表标签或可作为导航栏
ol,li	有序列表
table，th，tr，td	表格标签	定义表头，
定义行
form	表单标签
dl,dt，dd	定义一个列表 定义一个项目 描述项目