前端面试理论题
- 什么是HTML?
超文本标记语言（英语：HyperText Markup Language，简称：HTML）是一种用于创建网页的标准标记语言。
2、DOCTYPE 的作用是什么？标准与兼容模式（混杂模式）各有什么区别？
DOCTYPE 的作用是告知浏览器的解析器用什么文档标准解析这个文档。
标准模式：用于呈现最新浏览器。
兼容模式：用于呈现老式的浏览器。
简单的说，就是尽可能的显示能显示的东西给用户看。
3、html5为什么只需要写? 你知道多少种Doctype文档类型？
html5不基于SGML,因此不需要对DTD进行引用，但是需要doctype来规范浏览器的行为。
有3种文档类型定义分别是：过渡的（Transitional）、严格的（Strict）和框架（Frameset）。
4、编码集的作用是什么？说出几个常见的编码集？为什么常用utf-8?
编码集在数据传输的作用 UNICODE 相当于规定了字符对应的码值,这个码值必须编码成字节的形式去传输和存储。
最常见的编码方式是： UTF-8,另外还有 UTF-16,UTF-32 等。
UTF-8 是 UNICODE 的一种变长字符编码，即 RFC 3629。简单的说大字符集可以解决多种语言文本显示问题，从而实现应用国际化和本地化。
对系统来讲，UTF-8 编码可以通过屏蔽位和移位操作快速读写，排序更加容易。UTF-8 是字节顺序无关的，它的字节顺序在所有系统中都是一样的。因此 UTF-8 具有更高的性能。
5、mate viewport是什么？原理是什么？
Viewprot是用户网页的可视区域。
该meta标签的作用是让当前viewport的宽度等于设备的宽度，同时不允许用户手动缩放。
6、行内元素有哪些？块级元素有哪些？ 行内块元素有那些？
行内元素有： a、 b、span、br、 i、 s。
块级元素有：div、 ul、ol、li、h1...h6、p、td、th、form。
行内块元素有：img、input、textarea。
7、简述a标签target属性的取值和作用？
target可能的值：
blank：在新窗口/选项卡中打开。
self：在同一框架中打开。
parent：在父框架中打开。
top：在整个窗口中打开。
8、标签上的title属性与alt属性的区别是什么?
title；对链接起注释作用，图片正常显示使鼠标划上去会显示他的值。
alt；对图片起注释作用，图片无法加载的时候会显示它的值。
9、对WEB标准以及W3C的理解与认识
web标准，就是将页面的结构、表现和行为这三部分独立分开，使其更具有模块化。
W3C对web标准提出了规范化的要求，也就是在实际编程中的一些代码规范。
10、前端页面有哪三层构成，分别是什么，作用是什么？
结构层：HTML 搭建文档的结构
样式层：CSS 设置文档的呈现效果
行为层：JS 实现文档的动态行为
11、什么是iframe？请讲述一下iframe框架的优缺点？
1.iframe是html元素，用于在网页中内嵌另一个网页。
2.iframe默认有一个宽高,存在边界
3.iframe是一个行内快级元素，可以通过display修改
优点：
- iframe 能够原封不动的把嵌入的网页展现出来。
- 如果有多个网页引用 iframe，只需要修改 iframe 的内容，就可以实现调用的每一个页面内容的更改。
缺点：
- 框架结构中出现各种滚动条
- iframe 会阻塞主页面的 Onload 事件
12、form 的作用？
标签用于为用户输入创建 HTML 表单。 表单能够包含 input 元素，比如文本字段、复选框、单选框、提交按钮等等。
表单还可以包含 menus、textarea、fieldset、legend 和 label 元素。
表单用于向服务器传输数据。
13、HTML中有哪些属于表单元素?那些属于表格元素?请分别列举5个并说明用途？
HTML中常用的表单元素包括：文本区域(TEXTAREA)，列表框(SELECT)，文本输入框(INPUT type=text)，密码输入框(INPUT type=password)，单选输入框(INPUT type=radio)，复选输入框(INPUT type=checkbox)，重置按钮、提交按钮、隐藏域、等等。
基本的表格
有三个元素是每个表格都必须要有的: table、tr和td。元素table，是HTML用以支持表格式内容的核心元素，它表示HTML文档中的表格。
14、如何定义一个单选按钮？
15、input只读，禁用，必填，提示词（占位符）属性分别是什么？
readonly 属性规定输入字段为只读（不能修改）
disabled 属性规定输入字段是禁用的
required 属性规定必需在提交之前填写输入字段。
Placeholder(占位符) 是 HTML5 新增的一个 HTML 属性，用来对可输入字段的期望值提供提示信息，
16、请写出input常用的13种type类型，并写出每种类型的应用场景
text 默认的输入类型。
password 密码，表现为一连串的点。
file 文件上传控件。
radio 单选按钮
checkbox 复选框
hidden 隐藏的输入字段，用于在表单中添加对用户不可见
button 按钮
image 图像形式的提交按钮
reset 重置按钮,清除表单中所有数据
submit 提交按钮,提交按钮会把表单数据发送到服务器
color 调色板
tel 包含电话号码的输入域
search 搜索域
number 包含数值的输入域
range 包含一定范围内数字值的输入域
date 选取日、月、年的输入域
month 选取月、年的输入域
week 选取周、年的输入域
time 选取月、年的输入域
datetime 选取时间、日 月、年的输入域(UTC时间)
datetime-local 选取时间、日 月、年的输入域(本地时间)
17、input的disabled 属性和 readonly 属性的区别？
readonly 属性规定输入字段为只读。
只读字段是不能修改的。不过，用户仍然可以使用 tab 键切换到该字段，还可以选中或拷贝其文本。
readonly 属性可以防止用户对值进行修改，直到满足某些条件为止（比如选中了一个复选框）。然后，需要使用 JavaScript 消除 readonly 值，将输入字段切换到可编辑状态。
readonly 属性可与 或 配合使用。
disabled 属性规定应该禁用 input 元素。
被禁用的 input 元素既不可用，也不可点击。可以设置 disabled 属性，直到满足某些其他的条件为止（比如选择了一个复选框等等）。然后，就需要通过 JavaScript 来删除 disabled 值，将 input 元素的值切换为可用。
18、label的作用是什么？是怎么用的？
label标签是用来定义表单控制间的关系，当用户选择该标签时，浏览器会自动将焦点转到和标签相关的表单控件上。
主要有以下两种用法用法：
19、datalist 是什么？有什么用？
datalist是html5中出现的新标签，它需要配合input输入框来使用，它的作用就是定义了input可能要输入的值（可以被快捷选择），
定义一个datalist的标签需要给他一个id，input就是根据id来与其绑定的，datalist中的option就是和列表一样，里面的每个数据都是可被用户所选择的
20、input 的 name 属性的作用？
1.name 属性规定 input 元素的名称
2.name 属性用于对提交到服务器后的表单数据进行标识，或者在客户端通过 JavaScript 引用表单数据
3.只有设置了 name 属性的表单元素才能在提交表单时传递它们的值，因为服务端获取表单提交的数据是通过表单元素的 name 属性的值而得到的，没有 name 属性就无法得到表单元素提交给服务端的值
21、相对、绝对路径的区别是什么？
相对路径：从一个目录为起点到另外一个的目录的路径。
绝对路径：从根目录为起点到某一个目录的路径。