前端常见问题

news2024/11/17 11:45:36

一、<!DOCTYPE html>作用

<!DOCTYPE>是html文档的第一行,用于声明文档的类型,它会告诉浏览器要用哪一种HTML规范来渲染文档,确保正确渲染页面。

二、src href 的区别

(一)、请求资源类型的不同

在请求src资源时,要先将其指向的资源下载并且应用到文档中

href表示超文本引用,用于建立当前元素和href引用资源的链接

(二)、作用结果不同

src会替换当前元素自身内容:如下

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script src="demo.js">
        console.log("hello");
    </script>
</body>

</html>
console.log("hello world!");

 结果:

href主要是用于当前元素和引用资源之间建立一种联系,不会替换当前内容(link a)

(三)、浏览器解析方式不同

当浏览器解析到src时,会暂停对其他资源的处理,直到src指向的资源加载、编译、执行完毕,才会继续对其他资源的处理;

当浏览器解析到href时,并不会停止对其他资源的处理。

三、主流浏览器得内核介绍

内核主要作用是什么:对页面进行渲染

  • Chromium/Blink‌:由谷歌开发的内核,是目前最为流行的浏览器内核之一,包括谷歌Chrome、Microsoft Edge、Opera等。Chromium/Blink内核的特点包括渲染速度快、安全性高、省电省流量和良好的Web标准兼容性。

  • Gecko‌:由Mozilla基金会开发的内核,主要用于Firefox浏览器。Gecko内核的特点包括支持Web标准、高速渲染、安全性和可定制性。

  • WebKit‌:由苹果公司开发的内核,最初是为Safari浏览器设计的,也被用于其他浏览器,如UC浏览器、360浏览器等。WebKit的特点包括渲染速度较快、高效命中缓存、能力可扩展和高度兼容性。

  • Trident‌:由Microsoft开发的内核,曾被用于Internet Explorer浏览器,目前已被Edge采用Chromium/Blink内核代替。Trident内核的特点包括兼容性、安全性、引入ActiveX和渲染速度较慢。

  • Presto‌:由Opera Software开发的内核,曾被用于Opera浏览器,目前已被Opera采用Chromium/Blink内核代替。Presto的特点包括渲染速度较快、兼容性好、高度可定制性和安全性好。

四、什么是BFC

‌BFC的全称是Block Formatting Context,即块格式化上下文。‌这是一个CSS中的概念,它决定了如何渲染块级盒子,并且规定了内部盒子如何与BFC外部的盒子及其他元素交互。BFC是一个隔离的独立容器,容器里的元素不会影响到容器外部的元素。通过设置某些属性,如overflow: hidden;,可以创建一个新的BFC,从而改变元素的布局规则,解决父元素高度塌陷等问题,避免高度塌陷问题的发生。BFC的应用包括自适应两栏、三栏的布局,清除内部浮动,以及利用BFC消除margin重叠等‌。

其实就是独立渲染区域

五、原型和原型链

  • 原型‌:在JavaScript中,每个构造函数都有一个prototype属性,这个属性是一个指向原型对象的指针。原型对象包含了可以由该构造函数创建的所有对象的共享属性和方法。当创建一个新对象时,这个新对象会从其构造函数的prototype属性继承属性和方法。这意味着,通过修改原型,可以为所有对象实例添加或修改共享的方法或属性。

  • 原型链‌:当试图访问一个对象的属性时,JavaScript会首先检查这个对象自身是否有这个属性。如果没有找到,那么JavaScript会转向这个对象的原型对象查找该属性。如果原型对象也没有这个属性,会继续查找原型的原型,这个过程会一直持续下去,直到找到属性或者达到原型链的末端(即Object.prototype.__proto__null)。这种查找机制形成了一个链式结构,被称为原型链。

六、深浅拷贝

  • 浅拷贝‌:只是复制了源对象的引用,而不是对象本身的内容。如果源对象包含嵌套的对象或数组,那么这些嵌套的对象或数组的引用也会被复制,但嵌套的对象或数组的内容仍然是共享的。这意味着,如果你修改了浅拷贝后的对象或数组中的嵌套元素,原始对象或数组中的相应元素也会被修改,因为它们实际上指向的是同一个内存地址。浅拷贝适用于基本数据类型(如数字、字符串等)和简单的数据结构,因为它复制的是引用而不是实际的内容。

  • 深拷贝‌:则是递归地复制源对象的所有内容,包括嵌套的对象或数组。深拷贝会创建一个全新的对象或数组,其中的元素与原始对象或数组完全独立,不共享任何内存地址。这意味着,无论你如何修改深拷贝后的对象或数组中的内容,原始对象或数组都不会受到影响。深拷贝适用于需要完全独立副本的场景,特别是当对象或数组包含复杂的数据结构时。

浅拷贝通常用于简单的数据结构复制,如基本数据类型或一层嵌套的对象或数组。而深拷贝则适用于需要完全独立副本的复杂数据结构,如多层嵌套的对象或数组。选择使用哪种拷贝方式取决于具体的需求和数据结构的复杂性‌

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

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

相关文章

研究生如何利用 ChatGPT 帮助开展日常科研工作?

研究生可以通过以下几种方式利用 ChatGPT 来帮助开展日常科研工作&#xff1a; 文献综述和研究方向&#xff1a;ChatGPT 可以帮助研究生快速了解某一领域的研究现状和热点问题。通过提供相关的文献综述、研究趋势和技术细节&#xff0c;ChatGPT 可以协助确定研究方向和课题。 …

来抄作业!企业财务报表还可以做出这样的可视化效果

从繁琐的手工记账到智能化的数据分析&#xff0c;每一步都标志着企业向更加高效、精准的管理模式迈进。大家可以想象一下&#xff0c;将复杂多变的财务数据以直观、动态的形式展现在眼前的大屏之上&#xff0c;会是一种怎样的体验&#xff1f; 这里就要说到使用山海鲸报表工具搭…

解读2024年国自然资助情况:史上最卷,三无人员也能中

2024年国自然资助情况 面上史上最难&#xff01; 面上项目申请近18万&#xff0c;资助20758项&#xff0c;资助率为11.66%&#xff0c;较2023年下降5.33个百分点。这与今年取消了"申二停一"限制有关&#xff0c;导致资历老的教授、各类人才帽子大量涌入&#xff0c…

昇腾 AscendCL C++应用开发 获取模型的信息

昇腾 AscendCL C应用开发 获取模型的信息 flyfish 举例说明 程序在香橙派 AIpro 下获取到的模型信息 从ACLLite代码里看一些类型&#xff0c;因为获取模型信息的时候&#xff0c;会获取到数字&#xff0c;所以要看数字代表的意思&#xff0c;所有要看常量的名字 数据类型 # …

ch32v307vct6从头移植FreeRTOS

使用官方的ide可以直接创建带FreeRTOS的工程,但是不利于我们学习移植,所以特此记录怎么从头开始移植FreeRTOS到CH32V307VCT6芯片使用。 下载FreeRTOS源码 首先进入https://www.freertos.org/官网,然后找到如下Download字样,进入下载即可 下载完成后我们解压使用。移植开始…

Anzo Capital昂首资本:外汇市场交易策略与平均价格优化

在外汇市场的波动中&#xff0c;Anzo Capital昂首资本通过优化开仓头寸的平均价格&#xff0c;以最小的风险获取最大的利润&#xff0c;致力于帮助投资者实现更精准的交易策略。本文将探讨如何通过策略性地设置订单&#xff0c;来降低平均成本并提高盈利潜力。 Anzo Capital昂…

TypeSript7 class类

ES6提供了更接近传统语言的写法&#xff0c;引入了Class&#xff08;类&#xff09;这个概念&#xff0c;作为对象的模板。通过class关键字&#xff0c;可以定义类。基本上&#xff0c;ES6的class可以看作只是一个语法糖&#xff0c;它的绝大部分功能&#xff0c;ES5都可以做到…

IF 17.3|植物细胞器想发高分文章?你缺的可能是这些内容

文章内容导读 叶绿体和线粒体是唯一拥有内共生起源基因组的细胞器。近年来&#xff0c;测序技术的进步促进了大量植物细胞器基因组的发表&#xff0c;并揭示了它们之间极大的进化轨迹差异。本综述量化了在植物进化树中分布广泛的已测序植物细胞器基因组的数量和分布情况。 文章…

DHCP详解与应用——从原理到实战模拟

1. 引言 在现代网络中&#xff0c;IP地址的自动分配已成为基础设施管理中不可或缺的一部分。动态主机配置协议&#xff08;DHCP&#xff0c;Dynamic Host Configuration Protocol&#xff09;作为一种广泛应用的网络协议&#xff0c;通过自动为设备分配IP地址、子网掩码、网关等…

实用Python自动化脚本案例分享

前言 每天你都可能会执行许多重复的任务&#xff0c;例如阅读新闻、发邮件、查看天气、打开书签、清理文件夹等等&#xff0c;使用自动化脚本&#xff0c;就无需手动一次又一次地完成这些任务&#xff0c;非常方便。而在某种程度上&#xff0c;Python就是自动化的代名词。 1、自…

【书生大模型实战营第三期 | 进阶岛第5关-茴香豆:企业级知识库问答工具】

学习心得&#xff1a;茴香豆&#xff1a;企业级知识库问答工具 摘要 《茴香豆&#xff1a;企业级知识库问答工具》课程详细介绍了由书生浦语团队开发的开源知识问答工具——茴香豆。该系统针对国内企业级使用场景进行了专门的设计和优化&#xff0c;具备三阶段Pipeline架构&am…

【Node】【3】回调函数

nodejs 是一个基于事件驱动和非阻塞异步的JavaScript运行时环境。 Node.js 采用单线程模型&#xff0c; 单线程意味着 Node.js 在任何给定时刻只能执行一段代码&#xff0c;但通过异步执行回调函数&#xff0c;可以在等待 I/O 操作完成的同时继续执行其他代码&#xff0c;从而…

【PL/pgSQL】华为数据库GaussDB及PostgreSQL 数据库系统的过程语言

文章目录 介绍 PL/pgSQL为什么选择 PL/pgSQL&#xff1f;基本语法和结构1. 基本结构2. 变量声明3. 控制结构4. 循环 存储过程与函数1. 创建存储过程2. 调用存储过程3. 自定义函数 触发器1. 创建触发器函数2. 创建触发器 异常处理高级语法特性示例控制结构条件语句循环 异常处理…

【Linux】06.Linux 下的编译器——gcc/g++

在之前的C语言的博客中&#xff0c;我们有谈到过编译与链接 从源代码到可执行程序要经过如下过程&#xff1a; 预处理&#xff08;进行宏替换&#xff09;编译&#xff08;将C语言代码翻译成汇编代码&#xff09;汇编&#xff08;将汇编代码解析成二进制指令&#xff09;链接&…

Python基础—Python保护代码和数据的方法

保护代码和数据的安全性至关重要。无论是防止代码被轻易修改&#xff0c;还是确保数据的隐私与完整性&#xff0c;采取适当措施都是必不可少的。今天&#xff0c;我们就来揭开六大保护策略的神秘面纱&#xff0c;让初学者也能轻松掌握这些实用技巧。 1. 使用加密技术保护敏感…

无需代码,快速搭建:JNPF低代码平台的创新应用案例

在数字化转型的浪潮中&#xff0c;企业对于迅速开发和部署应用的需求不断上升。传统的软件开发方法耗时较长、成本较高&#xff0c;难以适应快速变化的市场需求。低代码平台应运而生&#xff0c;它通过可视化界面和配置化手段&#xff0c;显著简化了应用开发流程。JNPF作为一款…

Java 中的抽象工厂模式:优雅地掌握对象创建

文章目录 一、概述三、抽象工厂设计模式的意图四、抽象工厂模式的详细解释及实际示例五、Java 中抽象工厂模式的编程示例六、抽象工厂模式类图七、Java 中何时使用抽象工厂模式八、抽象工厂模式 Java 教程九、抽象工厂模式的优点和权衡十、Java 中抽象工厂模式的实际应用十一、…

Python中的random模块及相关模块详解例子2解析

Python 的 random 模块提供了生成随机数的函数&#xff0c;这些函数可以用于各种场景&#xff0c;如模拟、游戏开发、加密等。以下是 random 模块的一些常用功能和示例。 基本函数 random.seed(aNone, /) - 初始化随机数生成器。如果提供相同的种子值&#xff0c;将生成相同的…

elastic-job定时任务

静态任务案例 ​ 使用elastic-job很容易&#xff0c;我们接下来学习下elastic-job的使用&#xff0c;这里的案例我们先实现静态任务案例&#xff0c;静态任务案例也就是执行时间事先写好。 实现步骤&#xff1a; 1.引入依赖包 2.配置zookeeper节点以及任务名称命名空间 3.实…

数据分析:锚定黄金营销节点,【出行+文化】成小红书大势

导语 据悉&#xff0c;小红书发布《十大搜索趋势洞察》&#xff0c;小编发现其中涉及到热门趋势【理性听劝】。本期&#xff0c;小编将以此展开&#xff0c;为即将到来的十一长假&#xff0c;为品牌提供营销启示。 洞察【出行文化】这件大事 在出行这件事上&#xff0c;小红…