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

news2024/11/26 20:34:08

一、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.coloradmin.cn/o/1875107.html

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

相关文章

C# 警告 warning MSB3884: 无法找到规则集文件“MinimumRecommendedRules.ruleset”

警告 warning MSB3884: 无法找到规则集文件“MinimumRecommendedRules.ruleset” C:\Program Files\Microsoft Visual Studio\2022\Professional\MSBuild\Current\Bin\amd64\Microsoft.CSharp.CurrentVersion.targets(129,9): warning MSB3884: 无法找到规则集文件“MinimumRe…

好书速览-深入理解JVM-Part1

文章目录 第二章、Java内存区域与内存溢出异常2.1 概述2.2 运行时数据区域程序计数器(program Counter Register)Java虚拟机栈本地方法栈堆方法区运行时常量池直接内存 2.3 对象生命周期2.3.1 对象的创建2.3.2 对象的内存布局对象头类型指针对齐填充 2.3.3 对象的访…

WordPress免费模板:惊艳动态效果,打造视觉盛宴

WordPress免费模板:惊艳动态效果,打造视觉盛宴 我们为您带来了一款独具特色的WordPress免费模板,这款模板以其独特的动态效果设计,特别是引人注目的动态banner图片效果,为您的网站注入活力,打造一场视觉盛…

某配送平台未授权访问和弱口令(附赠nuclei默认密码验证脚本)

找到一个某src的子站,通过信息收集插件,发现ZABBIX-监控系统,可以日一下 使用谷歌搜索历史漏洞:zabbix漏洞 通过目录扫描扫描到后台,谷歌搜索一下有没有默认弱口令 成功进去了,挖洞就是这么简单 搜索文章还…

定时触发-uniapp + uniCloud 订阅消息实战教程(三)

上一节已经对云函数有了一定的了解,但是,为了发送订阅消息,只会云函数还是差了那么一点意思,所以接下来的这一节,将带领大家熟悉一下定时触发。 熟悉定时触发 如果云函数需要定时/定期执行,即定时触发,您可以使用云函数定时触发器。已配置定时触发器的云函数,会在相应…

SwiftUI八与UIKIT交互

代码下载 SwiftUI可以在苹果全平台上无缝兼容现有的UI框架。例如,可以在SwiftUI视图中嵌入UIKit视图或UIKit视图控制器,反过来在UIKit视图或UIKit视图控制器中也可以嵌入SwiftUI视图。 本文展示如何把landmark应用的主页混合使用UIPageViewController和…

CXL:拯救NVMe SSD缓存不足设计难题-2

LMB提出了基于CXL协议的内存扩展框架和内核模块。该方案利用CXL内存扩展器作为物理DRAM源,旨在提供一个统一的内存分配接口,使PCIe和CXL设备都能方便地访问扩展的内存资源。通过这个接口,NVMe驱动和CUDA的统一内存内核驱动可以直接高效地访问…

telegram mini APP或游戏开发之bot设置

无意中发现telegram上居然也能发布小程序和游戏了,感觉发现了新大陆一样,自己好玩试了下。 参考教程 更详细的免费文章,请查看博客:https://lengmo714.top/6e79860b.html 要在telegram上开发一个mini App或者game,创建一个专属于你的机器人就必不可少了。 创建bot机器人 …

IoTDB Committer+Ratis PMC Member:“两全其美”的秘诀是?

IoTDB & Ratis 双向深耕! 还记得一年前我们采访过拥有 IoTDB 核心研发 Ratis Committer “双重身份”的社区成员宋子阳吗?(点此阅读) 我们高兴地发现,一年后,他在两个项目都更进一步,已成为…

MapReduce学习

目录 7.3 MapReduce工作流程 7.3.1 工作流程概述 7.3.2 MapReduce各个执行阶段 7.3.3 Shuffle过程详解 1. Shuffle过程简介(过程分为Map端的操作和Reduce端的操作) 2、Map端的Shuffle过程: 3、在Reduce端的Shuffle过程 7.4 实例分析&am…

Drag Select Compose:实现多平台图片多选功能的利器

Drag Select Compose:实现多平台图片多选功能的利器 在现代移动应用开发中,图片多选功能是一个常见且实用的需求。而实现这种功能可能涉及到复杂的手势处理和状态管理。今天,我将介绍一款强大的Compose多平台库——Drag Select Compose,它能够轻松实现类似于Google Photos…

[推荐]有安全一点的网贷大数据信用查询网站吗?

在互联网金融日益发展的今天,网贷大数据查询网站成为了许多人申贷前的必备工具。随着使用这些网站的人群越来越多,安全问题也逐渐浮出水面。最近,就有许多用户反馈自己的个人信息在网贷大数据查询网站上被泄露。为了解决这一问题,…

日立EX-PROII+系列全新升级,智慧随心控畅享新生活

随着科技的进步,各种智能家电也开始走入人们的生活,而在这个领域,日立用技术创新生活,不断为新时代注入活力,推出日立 EX-PROII系列家用净化中央空调,贯彻“小身材,大能量”核心设计理念&#x…

STM32第十一课:ADC采集光照

文章目录 需求一、ADC概要二、实现流程1.开时钟,分频,配IO2.配置ADC工作模式3.配置通道4.复位校准5.数值的获取 三、需求的实现总结 需求 通过ADC转换实现光照亮度的数字化测量,最后将实时测量的结果打印在串口上。 一、ADC概要 ADC全称是A…

小柴冲刺软考中级嵌入式系统设计师系列一、计算机系统基础知识(1)嵌入式计算机系统概述

flechazohttps://www.zhihu.com/people/jiu_sheng 小柴冲刺嵌入式系统设计师系列总目录https://blog.csdn.net/qianshang52013/article/details/139975720?spm1001.2014.3001.5501 根据IEEE(国际电气电子工程师协会)的定义,嵌入式系统是&q…

lvs+上一章的内容

书接上回这次加了个keepalived 一、集群与分布式 1.1 集群介绍 **集群(Cluster)**是将多台计算机组合成一个系统,以解决特定问题的计算机集合。集群系统可以分为以下三种类型: **LB(Load Balancing,负载…

rtthread stm32h743的使用(十一)spi设备使用

我们要在rtthread studio 开发环境中建立stm32h743xih6芯片的工程。我们使用一块stm32h743及fpga的核心板完成相关实验,核心板如图: 1.建立新工程,选择相应的芯片型号及debug引脚及调试器 2.编译下载,可以看到串口打印正常 3.…

SOAP vs REST介绍

SOAP(简单对象访问协议) 定义:SOAP是一种基于XML的通信协议,用于在网络中交换结构化信息,特别是在分布式环境和需要中介(如网关或防火墙)的环境中。它通过HTTP、SMTP等多种传输协议传输信息&…

APP项目测试 之 APP功能测试

1. APP测试流程 需求评审——计划编写——用例设计——用例执行——缺陷管理——测试报告 2. APP测试内容 功能测试 专项测试 性能测试 3.注册测试点扩充 4.登录测试点扩充 5.购物车测试点扩充 6.搜索测试点扩充 7.支付测试点扩充 8.评论测试点扩充 未完待续。…

Java校园跑腿小程序校园代买帮忙外卖源码社区外卖源码

🔥校园跑腿与外卖源码揭秘🔥 🚀 引言:为何需要校园跑腿与外卖源码? 在快节奏的校园生活里,学生们对于便捷、高效的服务需求日益增长。校园跑腿和外卖服务成为了解决这一需求的热门选择。然而,…