240 Star 2.1K Fork 87

鹏磊 / DevBooks

加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
克隆/下载
HTML最新2021年面试题,高级面试题及附答案解析.md 8.57 KB
一键复制 编辑 原始数据 按行查看 历史

HTML最新2023年面试题,高级面试题及附答案解析

全部答案,更新日期:2023年6月11日,直接下载吧!

下载链接:高清172份,累计 7701 页大厂面试题 PDF

1、Label 的作用是什么?是怎么用的?

label 标签来定义表单控制间的关系,当用户选择该标签时,浏览器会自动将焦点转到和标签相关的表单控件上。

Number:

2、拖放API:drag、drop

移除的元素:

1、 纯表现的元素:basefont big center font s strike tt u

2、 性能较差元素:frame frameset noframes

区分:

1、 DOCTYPE声明的方式是区分重要因素

2、 根据新增加的结构、功能来区分

3、如何优化关键渲染路径?(浏览器渲染过程)

为尽快完成首次渲染,我们需要最大限度减小以下三种可变因素:

1、 关键资源的数量。

2、 关键路径长度。

3、 关键字节的数量。

关键资源是可能阻止网页首次渲染的资源。这些资源越少,浏览器的工作量就越小,对 CPU 以及其他资源的占用也就越少。

同样,关键路径长度受所有关键资源与其字节大小之间依赖关系图的影响:某些资源只能在上一资源处理完毕之后才能开始下载,

并且资源越大,下载所需的往返次数就越多。

最后,浏览器需要下载的关键字节越少,处理内容并让其出现在屏幕上的速度就越快。要减少字节数,我们可以减少资源数(将它

们删除或设为非关键资源),此外还要压缩和优化各项资源,确保最大限度减小传送大小。

优化关键渲染路径的常规步骤如下:

1、 对关键路径进行分析和特性描述:资源数、字节数、长度。

2、 最大限度减少关键资源的数量:删除它们,延迟它们的下载,将它们标记为异步等。

3、 优化关键字节数以缩短下载时间(往返次数)。

4、 优化其余关键资源的加载顺序:您需要尽早下载所有关键资产,以缩短关键路径长度。

4、DOMContentLoaded 事件和 Load 事件的区别?

当初始的 HTML 文档被完全加载和解析完成之后,DOMContentLoaded 事件被触发,而无需等待样式表、图像和

子框架的加载完成。

Load 事件是当所有资源加载完成后触发的。

5、网页验证码是干嘛的,是为了解决什么安全问题?

区分用户是计算机还是人的公共全自动程序。可以防止恶意破解密码、刷票、论坛灌水

有效防止黑客对某一个特定注册用户用特定程序暴力破解方式进行不断的登陆尝试

6、如何减少回流?(浏览器绘制过程)

1、 使用 transform 替代 top

2、 不要把节点的属性值放在一个循环里当成循环里的变量

3、 不要使用 table 布局,可能很小的一个小改动会造成整个 table 的重新布局

4、 把 DOM 离线后修改。如:使用 documentFragment 对象在内存里操作 DOM

5、 不要一条一条地修改 DOM 的样式。与其这样,还不如预先定义好 css 的 class,然后修改 DOM 的 className。

7、xhtml和 html 有什么区别?

HTML是一种基本的 WEB 网页设计语言,XHTML 是一个基于 XML 的置标语言最主要的不同:

XHTML元素必须被正确地嵌套。

XHTML元素必须被关闭。

标签名必须用小写字母。

XHTML文档必须拥有根元素。

8、Doctype作用? 严格模式与混杂模式如何区分?它们有何意义?

1、 页面被加载的时,link会同时被加载,而@imort页面被加载的时,link会同时被加载,而@import引用的CSS会等到页面被加载完再加载

2、 import只在IE5以上才能识别,而linkXHTML标签,无兼容问题

3、 link方式的样式的权重 高于@import的权重

4、 <!DOCTYPE> 声明位于文档中的最前面,处于 <html> 标签之前。告知浏览器的解析器, 用什么文档类型 规范来解析这个文档

5、 严格模式的排版和 JS 运作模式是 以该浏览器支持的最高标准运行

6、 在混杂模式中,页面以宽松的向后兼容的方式显示。模拟老式浏览器的行为以防止站点无法工作。 DOCTYPE不存在或格式不正确会导致文档以混杂模式呈现

9、改变元素的外边距用什么属性?改变元素的内填充用什么属性?

改变元素的外边距用 margin,改变元素的内填充用 padding。

10、选择器优先级是怎样的?

!important>行内样式>id 选择器>类选择器>标签选择器>通配符>继承

权重算法

(0,0,0,0)==》第一个 0 对应的是 important 的个数,第二个 0 对应的是 id 选择器的个数,第三个 0 对

应的类选择器的个数,第四个 0 对应的是标签选择器的个数,就是当前选择器的权重。

比较:

先从第一个 0 开始比较,如果第一个 0 大,那么说明这个选择器的权重高,如果第一个相同,比较第二个,依次类推

11、如何处理 HTML5 新标签的浏览器兼容问题?

12、HTML元素的显示优先级?

13、b 与 strong 的区别和 i 与 em 的区别?

14、实现不使用 border 画出1px高的线,在不同浏览器的Quirks mode和CSS Compat模式下都能保持同一效果**

15、行内元素有哪些?块级元素有哪些? 空(void)元素有那些?行内元素和块级元素有什么区别?

16、如何实现浏览器内多个标签页之间的通信?

17、<img>titlealt有什么区别

18、常见的浏览器内核比较

19、HTML5的文件离线储存怎么使用,工作原理是什么

20、link 标签定义

21、px,em,rem的区别?

22、在新窗口打开链接的方法是?

23、怎么重构页面?

24、网页验证码是干嘛的,是为了解决什么安全问题

25、HTML5 的 form 的自动完成功能是什么?

26、HTTP的几种请求方法用途

27、从浏览器地址栏输入url到显示页面的步骤

28、HTML5为什么只需要写

29、iframe有那些缺点?

30、CSS 如何阻塞文档解析?(浏览器解析过程)

31、浏览器是怎么对 HTML5 的离线储存资源进行管理和加载的呢?

32、语义化的理解

全部答案,更新日期:2023年6月11日,直接下载吧!

下载链接:全部答案,整理好了

新增:高清PDF:172份,7701页,最新整理

Java
1
https://gitee.com/souyunku/DevBooks.git
git@gitee.com:souyunku/DevBooks.git
souyunku
DevBooks
DevBooks
master

搜索帮助