HTML5与Web技术详解-优快云博客

本文链接：https://blog.youkuaiyun.com/SignalFire/article/details/125148701

1、hgroup标签：用于对网页和区段的标题（section）进行组合

2、标题标签（dl dt dd h）不推荐嵌套块级元素

3、表格标签

<table>
           <caption>表格标题</caption>
           <tbody>
               <tr>
                   <th>行标题</th>
                   <td>行单元格</td>
                   <td>行单元格</td>
               </tr>
               <tr>
                   <th>行标题</th>
                   <td>行单元格</td>
                   <td>行单元格</td>
               </tr>
           </tbody>
       </table>

4、重排与重绘：

重排：页面内元素的创建与消失，元素尺寸改变，元素位置改变，display:none会导致重排。

重绘：重排导致重绘，字体颜色、背景颜色等元素外观改变但不影响布局的触发重绘不触发重排visibility:hidden触发重绘不触发重排

脱离文档流后不会引发回流

5、元数据内容（metadata content）：link、title、script、style、base、template、noscript等

6、disabled与readonly

disabled：阻止对元素的一切操作，如点击、获取焦点等,input内容不可提交

readonly：将元素设置为只读，其他操作正常，input可以提交

7、DOM tree的根节点是document

8、input元素的23种元素类型：

传统输入控件：button、checkbox、file、hidden、image、password、radio、reset、submit、text

新增：color、date、datetime、datetime-local、email、month、number、range、search、tel、time、url、week共13个

date与datetime-local都可以生成日历

<input type="date"/>

<input type="datetime-local"/>

9、meter标签：已知范围内的标量测量

<div class="a">
<meter value="3" min="0" max="10"></meter>
<meter value="0.6"></meter>
</div>

10、进度条：progress标签

<progress value="0.6"></progress>

11、HTML5之前的版本HTML4.01

12、创建块格式化上下文 BFC 的方式：

根元素(<html>)
浮动元素（元素的 float 不是 none）
绝对定位元素（元素的 position 为 absolute 或 fixed）
行内块元素（元素的 display 为 inline-block）
表格单元格（元素的 display为 table-cell，HTML表格单元格默认为该值）
表格标题（元素的 display 为 table-caption，HTML表格标题默认为该值）
匿名表格单元格元素（元素的 display为 table、table-row、 table-row-group、table-header-group、table-footer-group（分别是HTML table、row、tbody、thead、tfoot的默认属性）或 inline-table）
overflow 值不为 visible 的块元素
display 值为 flow-root 的元素
contain 值为 layout、content或 paint 的元素
弹性元素（display为 flex 或 inline-flex元素的直接子元素）
网格元素（display为 grid 或 inline-grid 元素的直接子元素）
多列容器（元素的 column-count 或 column-width 不为 auto，包括 column-count 为 1）
column-span 为 all 的元素始终会创建一个新的BFC，即使该元素没有包裹在一个多列容器中

13、element.clientWidth = width + padding

14、DHTML：Dynamic HTML 动态的HTML, 这门技术并不是一门新的技术, 而是将我们之前所学的HTML、CSS、JavaScript整合在一起，利用JS操作页面元素, 让元素具有动态的变化, 使得页面和用户具有交互的行为.

15、webstorage是本地存储，存储在客户端，包括localStorage和sessionStorage。

16、全局属性，所有的标签都可以使用的属性

17、DOM中的事件对象：（符合W3C标准）

preventDefault() 取消事件默认行为

stopImmediatePropagation() 取消事件冒泡同时阻止当前节点上的事件处理程序被调用。

stopPropagation() 取消事件冒泡对当前节点无影响。

18、<track> 标签为媒体元素（比如 <audio> and <video>）规定外部文本轨道。这个元素用于规定字幕文件或其他包含文本的文件，当媒体播放时，这些文件是可见的。

19、slideUp()和slideDown都是jQuery函数，slideUp()通过使用滑动效果，隐藏被选元素，如果元素已显示出来的话。slideDown() 方法通过使用滑动效果，显示隐藏的被选元素。

20、bgcolor 是 body 标签的一个属性，用于设置body的背景色

21、link标签是同时加载的 script标签才会加载完一个再加载另一个

加载页面时，link标签引入的 CSS 被同时加载；@import引入的 CSS 将在页面加载完毕后被加载。

22、页面不跳转的标准应该是点击链接后，链接的效果(样式)没有发生变化。即a:visited 、a:hover 、a:active的样式不起作用。

<a href="javascript:;">
href="javascript:;"
</a>

23、form表单的enctype 属性规定在发送到服务器之前应该如何对表单数据进行编码。

属性值

application/x-www-form-urlencoded 在发送前编码所有字符（默认）
multipart/form-data 不对字符编码。在使用包含文件上传控件的表单时，必须使用该值。
text/plain 空格转换为 "+" 加号，但不对特殊字符编码。
24、<embed> 标签定义了一个容器，用来嵌入外部应用或者互动程序（插件）

25、output用于表示 HTML5 中不同类型输出的结果

26、date 选取日、月、年 month 选取月和年 week 选取周和年 time 选取时间（小时和分钟）

27、HTML <param>元素为<object>元素定义参数

28、锚伪类

在支持 css 的浏览器中，链接的不同状态都可以不同的方式显示，这些状态包括：活动状态，已被访问状态，未被访问状态和鼠标悬停状态。用来表示链接不同状态的伪类就是锚伪类。

a:link {color: green;} /* 未访问的链接 */

a:visited {color: blue;} /* 已访问的链接 */

a:hover {color:orange;} /* 鼠标移动到链接上 */

a:active {color: yellow;} /* 选定的链接 */

几个伪类必须按照一定的顺序(l-v-h-a)，a:hover必须被置于a:link和a:visited之后，才是有效的；a:active必须被置于a:hover之后，才是有效的。
书写顺序很重要：a:link - a:visited - a:hover - a:actived。

29、跨域

CSS 文件的加载不受跨域限制；
window.onerror 方法默认情况下无法获取跨域脚本的报错详情
canvas 中使用 drawImage 贴图会受跨域限制

30、getContext() 方法返回一个用于在画布上绘图的环境

31、可将一对象的背景色透明度改为80%的声明：filter:alpha(opacity=80);

32、HTML5提供的数据存储有哪些？

localStorage、sessionStorage、webStorage

33、i、em标签都表示斜体

34、DOM树一共有12种节点类型，常用的有4种：

Document类型（document节点）——DOM的“入口点”
Element节点（元素节点）——HTML标签，树构建块
Text类型（文本节点）——包含文本
Comment类型（注释节点）——有时我们可以将一些信息放入其中，它不会显示，但JS可以从DOM中读取它。

35、包含在 <sup> 标签和其结束标签 </sup> 中的内容将会以当前文本流中字符高度的一半来显示，但是与当前文本流中文字的字体和字号都是一样的。

<sup></sup>上标

<sub></sub>下标

<mark></mark>突出显示

36、<source> 元素为 <audio>、<video> 和 <picture> 元素指定多个媒体资源

37、如果一个元素拥有ID属性,那么ID属性的属性值就会成为window对象的属性名.

创建带有 ID 属性的 DOM 元素有什么副作用

```
会增加内存负担
```
```
会创建同名的全局变量
```

38、Video/Audio中的

方法：load() play() pause()
事件：play() playing() pause() seeked() seeking() abort()当音频/视频的加载已放弃时触发

39、为同一个文件添加多种文件格式的原因是什么？例：

<source src="html_5.mp4" type="video/mp4">
<source src="html_5.ogv" type="video/ogg">

答：提供备份支持并解决媒体支持问题
媒体支持问题:不同浏览器及版本可能对文件格式的支持不同，多放几个格式以免浏览器碰到一个文件不能支持 
提供备份支持：如果浏览器两个格式都能支持，其中一个文件某些原因不能播放了，那还有另外一个文件可用嘛

40、multiple用于select的多选或者上传多个文件

41、user-scalable 表示用户是否可以手动缩放

42、css盒模型，块之间共享垂直外边距margin，margin取其大。

43、html5中新增了manifest标签，它有什么作用？

应用缓存资源清单

44、<cite> 标签通常表示它所包含的文本对某个参考文献的引用，比如书籍或者杂志的标题。

45、relative相对自身进行偏移；absolute相对上一级有定位的祖先元素

45、作者：田聪12138
链接：暑期实习_我要提问_牛客网
来源：牛客网

中兴通讯内推码【DSz8XtaJ】投递链接：中兴通讯全球招聘门户
网易游戏（互娱）内推码【yBKyeM】投递传送门：网易游戏(互娱)校园招聘官网
深信服科技【NTAHmvy】校招官网链接：hr.sangfor.com
海康威视【NBT14E】PC端校招官网：campushr.hikvision.com
荣耀【ofshxh】校招官网链接：荣耀最新招聘信息 | 荣耀招聘官网网站

46、UTF-8（8-bit Unicode Transformation Format）是一种针对Unicode的可变长度字符编码，又称万国码。UTF-8使用1~4字节为每个字符编码。用在网页上可以同一页面显示中文简体繁体及其它语言（如英文，日文，韩文）。

GBK是汉字编码，是双字节码，可表示繁体字和简体字。

47、电子邮件：<a href=”mailto:love@baidu.com”>love@baidu.com</a>

48、哪个元素表示用于生成公钥-私钥对的控件？keygen

49、万维网用url统一资源定位符标识分布因特网上的各种文档，HTML是超文本标记语言，是网页制作的一种编写语言。

50、SVG

SVG 指可伸缩矢量图形 (Scalable Vector Graphics)

SVG 用来定义用于网络的基于矢量的图形
SVG 使用 XML 格式定义图形
SVG 图像在放大或改变尺寸的情况下其图形质量不会有所损失
SVG 是万维网联盟的标准

SVG 与诸如 DOM 和 XSL 之类的 W3C 标准是一个整体

(SVG是HTML下的一个分支)

51、HTML5 中可以使用 data-* 自定义属性

52、param 元素允许您为插入 XHTML 文档的对象规定 run-time 设置，也就是说，此标签可为包含它的 <object> 标签提供参数。