前端面试题(基础篇十二)

一、link标签定义、与@import的区别

 link 标签定义文档与外部资源的关系。

 link 元素是空元素,它仅包含属性。 此元素只能存在于 head 部分,不过它可出现任意数。

 link 标签中的 rel 属性定义了当前文档与被链接文档之间的关系。常见的 stylesheet 指的是定义一个外部加载的样式表。

区别:

   (1)从属关系区别。 @import 是 CSS 提供的语法规则,只有导入样式表的作用;link 是 HTML 提供的标签,不仅可以加载 CSS 文件,还可以定义 RSS、rel 连接属性、引入网站图标等。

   (2)加载顺序区别。加载页面时,link 标签引入的 CSS 被同时加载;@import 引入的 CSS 将在页面加载完毕后被加载。

   (3)兼容性区别。@import 是 CSS2.1 才有的语法,故只可在 IE5+ 才能识别;link 标签作为 HTML 元素,不存在兼容性问题。

   (4)DOM 可控性区别。可以通过 JS 操作 DOM ,插入 link 标签来改变样式;由于 DOM 方法是基于文档的,无法使用 @import 的方式插入样式。

二、对浏览器的理解

浏览器的主要功能是将用户选择的web资源呈现出来,它需要从服务器中请求资源,将其显示在浏览器窗口中,请求资源的格式通常为HTML,也可以是PDF、image及其他格式。用户通过URI(Uniform Resource Identifier 统一资源标识符)来指定资源的位置。

在HTML和CSS中规定了浏览器解析html文档的方式,由W3C组织对这些规范进行维护,W3C是指定web标准的组织。

由于浏览器厂商大多自己开发扩展,对W3C制定的规范并不完全遵守,这对web开发者带来许多兼容性问题。

简单来说,浏览器分为两个部分,shell和浏览器内核。shell的种类比较多,内核比较少;shell指的是浏览器的外壳,例如菜单,工具栏等,主要是提供给用户界面操作,参数设置等,它可以调用内核来实现各种功能;内核时浏览器的核心,基于标记语言显示内容的模块或程序,当然,也有一些浏览器不区分外壳和内核。

三、介绍一下你对浏览器内核的理解

主要分为两个部分:渲染引擎和 JS 引擎

渲染引擎的主要职责就是渲染,将请求的资源在浏览器窗口中渲染出来。默认情况下,渲染引擎可以显示HTML、XML文档及图片,它可以借助插件(扩展)显示其他类型的数据。例如PDF

JS 引擎: 用来解析和执行JavaScript代码来实现网页动态效果

最初渲染引擎和js引擎并没有明显的区分,后来js引擎越来越独立(例如常见的V8引擎),内核就倾向于指渲染引擎。

四、常见的浏览器内核

   (1) IE 浏览器内核:Trident 内核,也是俗称的 IE 内核;

    (2) Chrome 浏览器内核:统称为 Chromium 内核或 Chrome 内核,以前是 Webkit 内核,现在是 Blink内核;

    (3) Firefox 浏览器内核:Gecko 内核,俗称 Firefox 内核;

    (4) Safari 浏览器内核:Webkit 内核;

    (5) Opera 浏览器内核:最初是自己的 Presto 内核,后来加入谷歌大军,从 Webkit 又到了 Blink 内核;

    (6) 360浏览器、猎豹浏览器内核:IE + Chrome 双内核;

    (7) 搜狗、遨游、QQ 浏览器内核:Trident(兼容模式)+ Webkit(高速模式);

    (8) 百度浏览器、世界之窗内核:IE 内核;

    (9) 2345浏览器内核:好像以前是 IE 内核,现在也是 IE + Chrome 双内核了;

    (10)UC 浏览器内核:这个众口不一,UC 说是他们自己研发的 U3 内核,但好像还是基于 Webkit 和 Trident ,还有说 是基于火狐内核。

详细参考:《浏览器内核的解析和对比》icon-default.png?t=N7T8http://www.cnblogs.com/fullhouse/archive/2011/12/19/2293455.html

《五大主流浏览器内核的源起以及国内各大浏览器内核总结》icon-default.png?t=N7T8https://blog.csdn.net/Summer_15/article/details/71249203

五、渲染过程中遇到 JS 文件怎么处理?(浏览器解析过程)

 JavaScript 的加载、解析与执行会阻塞文档的解析,也就是说,在构建 DOM 时,HTML 解析器若遇到了 JavaScript,那么它会暂停文档的解析,将控制权移交给 JavaScript 引擎,等 JavaScript 引擎运行完毕,浏览器再从中断的地方恢复继续解析文档。

也就是说,如果你想首屏渲染的越快,就越不应该在首屏就加载 JS 文件,这也是都建议将 script 标签放在 body 标签底部的原因。当然在当下,并不是说 script 标签必须放在底部,因为你可以script 标签添加 defer 或者 async 属性。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/web/36260.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

双系统的笔记本电脑,系统引导不见了怎么办

双系统的笔记本电脑,系统引导不见了怎么办 个人情况 联想拯救者R9000P 按照了windows11(电脑自带的系统),后面自己按照了ubuntu22.04 只是windows11自动更新导致系统的引导项不见的 解决办法 在电脑开机的时候,不停…

Python酷库之旅-第三方库openpyxl(15)

目录 一、 openpyxl库的由来 1、背景 2、起源 3、发展 4、特点 4-1、支持.xlsx格式 4-2、读写Excel文件 4-3、操作单元格 4-4、创建和修改工作表 4-5、样式设置 4-6、图表和公式 4-7、支持数字和日期格式 二、openpyxl库的优缺点 1、优点 1-1、支持现代Excel格式…

回溯法c++学习 解决八皇后问题

使用回溯法解决八皇后问题 八皇后问题是一个以国际象棋为背景的问题:如何能够在88 的国际象棋棋盘上放置八个皇后,使得任何一个皇后都无法直接吃掉其他的皇后?为了达到此目的,任两个皇后都不能处于同一条横行、纵行或斜线上。这…

AUTOSAR汽车电子嵌入式编程精讲300篇-智能网联汽车CAN总线-发展现状

目录 前言 智能网联汽车的发展现状 国内外研究现状 智能网联汽车系统概述 智能网联汽车安全现状 智能网联汽车威胁分析 本文篇幅较长,分为多篇,文章索引详见 智能网联汽车CAN总线-发展现状 智能网联汽车CAN总线-智能网联汽车车内网络 智能网联汽车CAN总线-基于CAN…

pdf已加密如何解除?解密密码的两个方法【可加密】

电脑文件加密的目的就是保护重要信息,防止数据泄露。如果需要解除密码,应该如何操作呢?pdf已加密如何解除?本文整理了以下两种解除文件方法,希望能够帮到有需要的朋友们! 方法一、使用金舟文件夹加密大师解…

vue3+vite+nodejs,通过接口的形式请求后端打包(可打包全部或指定打包组件)

项目地址https://gitee.com/sybb011016/test_build 打包通过按钮的形式请求接口,让后端进行打包,后端使用express-generator搭建模版。前端项目就在npm init vuelatest基础上添加了路由 如果只想打包AboutView组件,首先修改后端接口。 //打…

Open3D (C++) 点云旋转至主成分空间

目录 一、算法原理二、代码实现三、结果展示本文由CSDN点云侠原创,原文链接。如果你不是在点云侠的博客中看到该文章,那么此处便是不要脸的爬虫与GPT。 一、算法原理 首先使用主成分分析法计算出点云的特征值与特征向量,然后根据点云的特征向量计算出点云与主成分空间之间的…

CocosCreator构建IOS教程

CocosCreator构建IOS教程 添加include: Header Search Paths:拖拽include过来 添加SoundEngine: Header Search Paths: 把SoundEngine POSIX Common 三个文件夹拖拽到里面去

Params(M), Multi-Adds (G),FLOPS之间的区别

参数数量(Params) 定义: 参数数量指的是模型中所有可训练参数的总数。这些参数包括权重和偏置项等 计算方式: 对于每一层神经网络,参数数量的计算方式如下: 全连接层(Fully Connected Layer&…

探索生成对抗网络(GANs)的新领域:创新应用与挑战

生成对抗网络(GANs)自2014年提出以来,已成为深度学习领域的一个重要分支。本文旨在探讨GANs在传统图像生成之外的新应用领域,包括艺术创作、虚拟现实、个性化推荐和生物信息学,并分析其面临的挑战和未来发展趋势。 关…

探讨公共表表达式(CTE)对对象关系映射(ORM)的影响:性能优化与最佳实践

在现代应用程序开发中,数据库查询和数据处理是不可或缺的一部分。为了提高开发效率和代码可维护性,ORM(对象关系映射)被广泛应用。然而,随着数据复杂度的增加,单纯依靠ORM进行复杂查询可能会导致性能瓶颈和…

如何将 ONLYOFFICE 文档 Linux 版更新到 v8.1

本指南将向您展示如何将 ONLYOFFICE 文档 Linux 版本更新到最新 8.1 版本。 ONLYOFFICE 文档是什么 ONLYOFFICE 文档是一个功能强大的文档编辑器,支持处理文本文档、电子表格、演示文稿、可填写表单、PDF 和电子书,可多人在线协作,支持 AI 集…

P A T 甲级:分类题型|字符串处理|1152、1150、1005、1001题解及延伸

系列目录 目录 系列目录1152 Google Recruitment数学证明substr()stoi() 1150 Travelling Salesman Problem1005 Spell It Right1001 AB Format 1152 Google Recruitment 原题链接 C 若未特殊标明&#xff0c;以下题解均写用C #include <iostream>using namespace std;…

软件设计师笔记-操作系统知识(二)

线程 以下是关于线程的一些关键点&#xff1a; 线程是进程中的一个实体&#xff1a;进程是操作系统分配资源&#xff08;如内存空间、文件句柄等&#xff09;的基本单位&#xff0c;而线程是进程中的一个执行单元。多个线程可以共享同一个进程的地址空间和其他资源。线程是CP…

ElasticSearch-Windows系统ElasticSearch(ES)的下载及安装

前言 下载ElasticSearch 可以进入ElasticSearch官方下载地址&#xff0c;选择与电脑系统相对应的版本&#xff1b;博主已经上传资源&#xff0c;或者点此直接免费下载&#xff0c;本次演示版本为8.14.1。 注意&#xff1a; Elasticsearch 5 需要 Java 8 以上版本&#xff1b;…

菜籽桌面4.5.0~4.5.1常见问题解答

目录 如何刷机&#xff1f; 刷机失败&#xff1f; 无法方控&#xff1f; 无法画中画? 原车音乐跟我安装的音乐一起播放&#xff1f; 原车音乐停了&#xff0c;我安装的软件也跟着没声音了&#xff1f; 调节声音时忽大忽小&#xff1f; 怎么安装软件&#xff1f; 软件…

探究互联网领域知识,解密数字化时代神秘面纱

随着信息时代的不断发展&#xff0c;互联网的发展呈现出爆炸式的增长&#xff0c;以至于引起广泛的关注和深入的探究。互联网作为一个庞大的网络体系&#xff0c;涵盖着无穷无尽的信息和知识&#xff0c;其背后的科技和应用已经改变了人们的生活&#xff0c;产生了翻天覆地的变…

easyexcel导出数据格式时,设置数值格式

easyexcel导出数据格式时&#xff0c;设置数值格式 ExcelProperty(value"得分", index1) NumberFormat("0.00_ ") private Double score;加注解NumberFormat("0.00_ ")&#xff0c;注意需要有下划线和空号 如果还不生效&#xff0c;需要修改pom…

在 JavaScript 中处理异步操作和临时事件处理程序

关键技术和设计总结 使用 Promise 和 then 进行异步操作: 我们通过使用 Promise 来处理异步操作&#xff0c;确保操作按顺序执行。在 getReportListByCurrentTime 函数中&#xff0c;返回一个 Promise 对象&#xff0c;保证在数据加载完成后调用 resolve&#xff0c;以便可以在…

锐捷网络闪耀CVPR 2024,外观异常检测方案斩获世界认可!

近日&#xff0c;锐捷网络在“视觉异常检测和创新性检测2024挑战赛”(Visual Anomaly and Novelty Detection 2024 Challenge&#xff0c;简称VAND)的少样本逻辑/结构异常检测赛道(VAND 2.0赛道2)中荣获第二名&#xff0c;并在计算机视觉顶级会议CVPR 2024上展示了这一成果&…