【前端面试3+1】15 CSS如隐藏元素、css块级元素和行内元素有哪些?两者有什么区别?、JavaScript中“==”与“===”的区别、【丢失的数字】

news2024/11/20 12:24:11

一、CSS如何隐藏元素?

1、使用 display: none;

  • 这种方法会隐藏元素,并且不占据页面空间
  • 元素会被完全移除,无法通过任何方式显示出来。
.hidden-element {
    display: none;
}

2、使用 visibility: hidden;

  • 这种方法会隐藏元素,但仍然占据页面空间
  • 元素在页面上不可见,但保留其尺寸和位置。
.hidden-element {
    visibility: hidden;
}

二、css块级元素和行内元素有哪些?两者有什么区别?

1、块级元素(Block-level Elements):

特点

  • 会在页面上以块的形式显示,独占一行或一块区域
  • 默认情况下,块级元素会从新的一行开始,占据整个可用宽度。
  • 可以设置宽度、高度、内外边距等属性。
  • 例如:<div>、<p>、<h1>-<h6>、<ul>、<li> 等。

2、行内元素(Inline Elements):

特点

  • 会在页面上以行内的形式显示,不会独占一行,会与其他行内元素在同一行上
  • 默认情况下,行内元素的宽度由其内容决定,不可设置宽度和高度。
  • 可以设置水平方向的内外边距,但不会影响垂直方向。
  • 例如:<span>、<a>、<strong>、<em>、<img> 等。

3、总的区别:

(1)显示方式
  • 块级元素会以块状显示,独占一行或一块区域;
  • 行内元素会在同一行内显示,不会独占一行。
(2)默认宽度
  • 块级元素的宽度默认为其父元素的100%,可以设置宽度和高度;
  • 行内元素的宽度由内容决定,不可设置宽度和高度。
(3)内外边距
  • 块级元素可以设置垂直和水平方向的内外边距;
  • 行内元素只能设置水平方向的内外边距。
(4)元素嵌套
  • 块级元素可以包含其他块级元素和行内元素;
  • 行内元素只能包含其他行内元素或文本。

三、JavaScript中“==”与“===”的区别

= =(相等运算符):

  • == 用于比较两个值是否相等,会进行类型转换
  • 如果两个值的类型不同,== 会尝试将它们转换为相同的类型,然后再进行比较。
  • 例如,1 == '1' 会返回 true,因为 '1' 会被转换为数字 1 进行比较。

= = =(严格相等运算符):

  • === 也用于比较两个值是否相等,但不会进行类型转换
  • 如果两个值的类型不同,=== 会直接返回 false,不会尝试进行类型转换。
  • 例如,1 === '1' 会返回 false,因为类型不同,不会进行类型转换。

总结区别:

  1. == 在比较时会进行类型转换,而 === 不会进行类型转换。
  2. 使用 === 更加严格和精确,避免了类型转换可能带来的意外结果。
  3. 在一般情况下,推荐使用 === 运算符进行严格相等比较,以避免潜在的类型转换问题。

四、【算法】丢失的数字

1、题目:

        给定一个包含 [0, n] 中 n 个数的数组 nums ,找出 [0, n] 这个范围内没有出现在数组中的那个数。

int missingNumber(int* nums, int numsSize) {
    
}

2、解题:
 

  1. 初始化一个变量 sum 用于存储数组 nums 中所有数字的总和,初始值为 0。
  2. 使用 for 循环遍历数组 nums,将数组中的每个数字累加到 sum 中。
  3. 计算范围 [0, n] 的总和,即 numsSize*(numsSize+1)/2
  4. 返回缺失的数字,即范围 [0, n] 的总和减去数组 nums 中所有数字的总和。
    int missingNumber(int* nums, int numsSize) {
        int sum=0;
        for(int i=0;i<numsSize;i++)
            {
            sum+=nums[i];
        }
        return numsSize*(numsSize+1)/2-sum;
    }

    方二:

int missingNumber(int* nums, int numsSize) {
    int total = (numsSize * (numsSize + 1)) / 2; // 计算 [0, n] 的总和
    int sum = 0;
    
    for (int i = 0; i < numsSize; i++) {
        sum += nums[i]; // 计算数组中所有数字的总和
    }
    
    return total - sum; // 返回缺失的数字
}

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

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

相关文章

线段树汇总

线段树是一种二叉搜索树&#xff0c;与区间树相似&#xff0c;它将一个区间划分成一些单元区间&#xff0c;每个单元区间对应线段树中的一个叶结点。 使用线段树可以快速的查找某一个节点在若干条线段中出现的次数&#xff0c;时间复杂度为O(logN)。而未优化的空间复杂度为2N&a…

Office 2024安装教程(附免费安装包资源)

鼠标右击软件压缩包&#xff0c;选择“解压到Office 2024安装包”。 打开解压后的文件夹&#xff0c;鼠标右击“YAOCTRI_Installer”选择“以管理员身份运行”。 输入数字“1”自动开始安装。 软件正在安装&#xff0c;请耐心等待&#xff0c;谢谢。 安装完成&#xff0c;点击“…

浅析Redis④:字典dict实现

什么是dict&#xff1f; 在 Redis 中&#xff0c;dict 是指哈希表&#xff08;hash table&#xff09;的一种实现&#xff0c;用于存储键值对数据。dict 是 Redis 中非常常用的数据结构之一&#xff0c;用于实现 Redis 的键空间。 在 Redis 源码中&#xff0c;dict 是一个通用…

初学python记录:力扣39. 组合总和

题目&#xff1a; 给你一个 无重复元素 的整数数组 candidates 和一个目标整数 target &#xff0c;找出 candidates 中可以使数字和为目标数 target 的 所有 不同组合 &#xff0c;并以列表形式返回。你可以按 任意顺序 返回这些组合。 candidates 中的 同一个 数字可以 无限…

Electron 30.0.0 发布,升级 Node 和 V8 引擎

近日&#xff0c;Electron 30.0.0 正式发布&#xff01;你可以通过 npm install electronlatest 进行安装&#xff0c;或者从 Electron 的发布网站下载&#xff0c;继续阅读了解此版本的详细信息。 &#x1f525; 主要更新 Windows 上支持 ASAR 完整性融合。如果未正确配置&am…

【JAVA基础篇教学】第十一篇:Java中字符串操作详解

博主打算从0-1讲解下java基础教学&#xff0c;今天教学第十篇&#xff1a;Java中字符串操作详解。 在 Java 编程中&#xff0c;字符串是一种常见的数据类型&#xff0c;通常用于存储文本信息。Java 提供了丰富的字符串操作方法&#xff0c;可以对字符串进行分割、截取、查找…

网络变压器在网络分析仪上能通过测试,装上设备后网速达不到呢?

Hqst华轩盛(石门盈盛)电子导读&#xff1a;今天和大家一起探讨网络变压器在网络分析仪上能通过测试&#xff0c;装上设备后网通设备网速达不到的可能原因及其处理方式 一、出现这种情况可能有以下原因&#xff1a; 1.1. 设备兼容性问题&#xff1a;设备其它元器件与 网络…

快速掌握缓存技术:学习多个缓存供应商(ehcache,redis,memcached,jetcache,j2cache)

缓存技术 缓存模拟缓存Spring缓存技术第三方缓存技术Ehcache缓存供应Redis缓存memcached缓存&#xff08;国内&#xff09; jetcache缓存供应商jetcache的基本使用设置外部服务设置本地服务 jetcache方法缓存j2cache 缓存 什么是缓存 缓存是一种介于数据永久存储介质与数据应用…

graphviz嵌入latex的方法

效果&#xff1a; graphviz graphviz是一个开源的工具包&#xff0c;用DOT语言编写可以自动转换成图形&#xff0c;因为写法非常简单&#xff0c;只用代码描述好连接关系&#xff0c;就能直接得到最终的图形&#xff0c;所以优势很大。 latex&#xff1a; 就不介绍了 graphvi…

单片机项目中太多全局变量有什么弊端?

最近有读者遇到了这样的问题&#xff1a; 入职接到前同事丢下的“烂摊子”&#xff0c;项目中很多全局变量 问我&#xff1a;全局变量太多有哪些弊端&#xff1f;该如何规避&#xff0c;以及如何管理全局变量等。 全局变量太多有哪些弊端&#xff1f; 真正做过项目的同学应该都…

备战2024年上海初中生古诗文大会:单选题真题示例和独家解析

上海市中小学生的初中生古诗文大会——即上海中学生古诗文大会&#xff08;初中组&#xff09;和小学生古诗文大会&#xff08;比赛&#xff09;除了题型略有不同外&#xff0c;最主要的是考察的内容深度和广度不同&#xff0c;初中的题目中对于文言文的考察大幅增加&#xff0…

SpringBoot相关知识点总结

1 SpringBoot的目的 简化开发&#xff0c;开箱即用。 2 Spring Boot Starter Spring Boot Starter 是 Spring Boot 中的一个重要概念&#xff0c;它是一种提供依赖项的方式&#xff0c;可以帮助开发人员快速集成各种第三方库和框架。Spring Boot Starter 的目的是简化 Sprin…

C语言数据结构之顺序表

目录 1.线性表2.顺序表2.1顺序表相关概念及结构2.2增删查改等接口的实现 3.数组相关例题 1.线性表 线性表&#xff08;linear list&#xff09;是n个具有相同特性&#xff08;数据类型相同&#xff09;的数据元素的有限序列。 线性表是一种在实际中广泛使用的数据结构&#xff…

【RV1106的ISP使用记录之基础知识】硬件连接关系与设备树的构建

RV1106具备2个mipi csi2 dphy硬件&#xff0c;1个VICAP硬件和1个ISP硬件。其中&#xff1a; 1、mipi csi2 dphy 用于对数据流的解析&#xff0c;支持MIPC,LVDS,DVP三种接口&#xff1b; 2、VICAP用于数据流的捕获&#xff1b; 3、ISP用于对图像数据进行处理&#xff1b; 这三个…

【QTM中文教程】01:Quick Terrain Modeller介绍、下载与安装

文章目录 一、Quick Terrain Modeller简介二、Quick Terrain Modeller特点功能三、Quick Terrain Modeller下载安装1. 下载地址2. 安装教程一、Quick Terrain Modeller简介 Quick Terrain Modeler(QTM)是一种专业的地形建模软件,用于处理和分析地形数据。它提供了一系列功能…

【漏洞复现】泛微e-cology ProcessOverRequestByXml接口存在任意文件读取漏洞

漏洞描述 泛微e-cology依托全新的设计理念,全新的管理思想。 为中大型组织创建全新的高效协同办公环境。 智能语音办公,简化软件操作界面。 身份认证、电子签名、电子签章、数据存证让合同全程数字化。泛微e-cology ProcessOverRequestByXml接口存在任意文件读取漏洞 免责声…

【漏洞复现】宏景eHR showmediainfo SQL注入漏洞

0x01 产品简介 北京宏景世纪软件股份有限公司&#xff08;简称“宏景软件”&#xff09;专注于国有企事业单位人力与人才管理数智化&#xff08;数字化、智能化&#xff09;产品的研发和应用推广。 0x02 漏洞概述 宏景eHR /workbench/duty/showmediainfo接口存在SQL注入漏洞…

Jenkins用maven风格build报错解决过程记录

1、Jenkins2.453新建项目&#xff0c;构建风格选的maven 2、自由风格构建部署没有任何问题&#xff0c;但是maven风格build一直失败&#xff0c;报错如下图 3、解决方案&#xff1a;在系统管理–系统配置–Maven项目配置&#xff0c;删除全局MAVEN_OPT的路径信息&#xff0c;…

oracle 清空回收站

参考官方文档 select * from user_recyclebin; select * from dba_recyclebin; ---清除回收站中当前用户下的对象 purge recyclebin; ---清除回收站中所有的对象 purge dba_recyclebin; ---清除回收站中指定用户的表 PURGE TABLE owner.table_name; ---清除回收站中指…