css3的var()函数

news2024/7/2 3:43:41

css3的var()函数

变量要以两个连字符--(横杆)(减号)为开头

在这里插入图片描述
变量可以在:root{}中定义, :root可以在css中创建全局样式变量。通过 :root本身写的样式,相当于 html,但优先级比后者高。





在CSS3中,var()函数是一个用于插入CSS自定义属性(也称为CSS变量)的值的函数。它允许你在样式表中定义可重用的值,并在多个地方引用它们,从而使你的CSS更加灵活和可维护。

使用var()函数的基本语法如下:

var(--variable-name, fallback-value)
  • --variable-name:必需的,表示自定义属性的名称,名称前必须有两个连字符(--)。
  • fallback-value:可选的,表示当自定义属性未定义时使用的回退值。

例如,你可以在:root选择器中定义一个自定义属性,并在其他地方使用var()函数来引用它:

:root {
  --main-color: #4285f4;
}

body {
  background-color: var(--main-color);
}

.button {
  background-color: var(--main-color);
  color: white;
  padding: 10px 20px;
  border-radius: 5px;
}

在这个例子中,:root选择器定义了一个名为--main-color的自定义属性,并将其值设置为#4285f4。然后,在body.button选择器中,使用var(--main-color)来引用该自定义属性的值。如果以后需要更改主色调,只需更新:root选择器中的--main-color值即可。

var()函数还可以接受一个可选的回退值,用于在自定义属性未定义时提供备选方案。例如:

.element {
  color: var(--undefined-color, black);
}

在这个例子中,如果--undefined-color未定义,则.element的颜色将回退到黑色。

需要注意的是,自定义属性的名称是区分大小写的,并且在引用时必须使用与定义时完全相同的名称。此外,自定义属性的作用域是它们被定义的选择器及其后代选择器。如果你想在整个文档中使用自定义属性,可以将其定义在:root选择器中,因为:root选择器表示文档树的根元素,通常是<html>元素。





CSS3 中的 var() 函数用于插入 CSS 自定义属性的值,这些自定义属性通常被称为 CSS 变量。这个函数提供了一种强大的方式来创建可重用和可维护的样式,尤其是在大型项目中,当需要在多个地方使用相同的值时。

基本语法

var(--custom-property-name, fallback-value)
  • --custom-property-name:必需的,表示自定义属性的名称,名称前必须有两个连字符(--)。这是为了区分自定义属性和现有的 CSS 属性。
  • fallback-value:可选的,当自定义属性无效或未定义时使用的回退值。

示例

以下是一个简单的例子,展示了如何在 CSS 中使用 var() 函数:

:root {
  --primary-color: #4285f4;
  --secondary-color: #0f9d58;
}

body {
  background-color: var(--primary-color);
  color: var(--text-color, #000); /* 如果 --text-color 未定义,则使用 #000 */
}

.button {
  background-color: var(--secondary-color);
  color: white;
  border: none;
  padding: 10px 20px;
}

在这个例子中,:root 选择器定义了两个自定义属性:--primary-color--secondary-colorbody 元素的背景色设置为 --primary-color 的值,而 .button 类的背景色设置为 --secondary-color 的值。注意,在 bodycolor 属性中,我们尝试使用一个未定义的自定义属性 --text-color,并提供了一个回退值 #000。由于 --text-color 没有在 :root 或其他地方定义,因此将使用回退值 #000

动态更新

CSS 变量的一个强大之处是它们可以动态更新,这意味着当变量的值改变时,所有使用该变量的样式都会自动更新。这使得在运行时通过 JavaScript 动态改变样式成为可能:

document.documentElement.style.setProperty('--primary-color', '#ff0000');

上面的 JavaScript 代码将 --primary-color 的值更改为红色,随后所有使用该变量的元素都会更新其样式以反映新的颜色。










CSS3中的var()函数用于定义和使用自定义变量。它允许你在CSS样式中使用变量,以便在多个地方重复使用相同的值。通过使用var()函数,你可以在CSS样式中引用和修改这些变量的值。

以下是两种使用var()函数的例子:

  1. 在CSS样式中定义和使用变量:
:root {
  --nav-bg-color: #333;
  --theme-color: #f00;
}

.background {
  background: linear-gradient(-180deg, var(--nav-bg-color) 0%, var(--theme-color) 100%);
}
  1. 在Vue组件中使用var()函数:
<template>
  <div class="box">Hello World</div>
</template>

<style lang="scss" scoped>
.box {
  color: var(--theme-bg);
}
</style>

这些例子展示了如何在CSS样式中定义和使用自定义变量,并通过var()函数引用这些变量的值。




// 错误写法
.test{
    --size: 20;
    font-size: var(--size)px;      // 这里的写法是错误,这样会读取成font-size:20 px,值的中间会多了一个空格,导致读取失败
}
 
// 正确写法
.test2{
    --size: 20px;
    --size2: 20;
    font-size: var(--size);
    font-size: calc(var(--size2) * 1px);
}







如何在JavaScript中设置CSS变量的值?





在JavaScript中,你可以使用window.getComputedStyle()方法和getPropertyValue()方法来获取CSS中的自定义属性(也称为CSS变量)的值。CSS变量通常是以--*开头的。

以下是一个简单的示例,展示了如何在JavaScript中获取CSS变量的值:

// 假设你有以下的CSS定义
:root {
  --main-color: #06c;
}

// 在JavaScript中获取这个变量的值
const element = document.documentElement; // 获取根元素,通常是<html>
const style = window.getComputedStyle(element);
const mainColor = style.getPropertyValue('--main-color');

console.log(mainColor); // 输出 "#06c"

在上面的代码中,我们首先获取了文档的根元素(通常是<html>元素),然后使用window.getComputedStyle()来获取这个元素的所有最终使用的CSS属性值。接着,我们使用getPropertyValue()方法来获取特定的CSS变量的值。

如果你想设置CSS变量的值,你可以直接在元素的style属性中设置,如下:

// 获取你想要设置变量的元素
const myElement = document.getElementById('myElement');

// 设置CSS变量的值
myElement.style.setProperty('--my-variable', 'red');

// 现在,CSS变量 --my-variable 在 myElement 及其子元素中可用,并且值为 'red'

请注意,setProperty()方法是在元素的style对象上调用的,而不是在window.getComputedStyle()返回的对象上。此外,通过这种方式设置的CSS变量只对该元素及其子元素有效,它们不会影响到文档的其他部分。

另外,CSS变量是大小写敏感的,因此在JavaScript中引用它们时必须确保大小写一致。



在JavaScript中设置和获取CSS中的自定义属性(也称为CSS变量)的值,可以通过以下方式实现:

获取CSS变量

要获取CSS中定义的变量值,你可以使用element.style.getPropertyValue()方法,但这仅适用于内联样式中定义的变量。对于在:root或其他选择器中定义的全局变量,你需要使用window.getComputedStyle()方法。

// 获取根元素
const root = document.documentElement;

// 使用getComputedStyle获取所有计算后的样式,包括CSS变量
const computedStyle = window.getComputedStyle(root);

// 获取CSS变量的值
const myVariable = computedStyle.getPropertyValue('--my-css-variable');

console.log(myVariable); // 输出CSS变量的值

设置CSS变量

要设置CSS变量的值,你可以直接修改元素的style属性或使用CSSStyleDeclaration对象的setProperty()方法。

// 获取你想要设置变量的元素
const myElement = document.getElementById('myElement');

// 使用setProperty设置CSS变量的值
myElement.style.setProperty('--my-css-variable', 'blue');

// 或者直接设置style属性(仅适用于内联样式)
myElement.style.cssText = `--my-css-variable: blue;`;

// 注意:这样设置的变量只会影响到该元素及其子元素

如果你想要设置全局的CSS变量(即影响整个文档的变量),你应该修改:root元素的样式:

// 获取根元素
const root = document.documentElement;

// 设置全局CSS变量的值
root.style.setProperty('--global-css-variable', 'green');

// 或者直接设置style属性
root.style.cssText = `--global-css-variable: green;`;

// 这样设置的变量将影响整个文档

注意事项

  • CSS变量名是大小写敏感的,因此在JavaScript中设置或获取变量时,必须确保大小写与CSS中定义的一致。
  • 通过element.style设置的内联样式仅适用于该元素本身,不会影响到其他元素。而通过修改:root元素设置的CSS变量是全局的,会影响到整个文档。
  • 如果CSS变量在样式表中定义,并且没有被JavaScript直接修改过,那么element.style.getPropertyValue()可能无法获取到这个变量的值。在这种情况下,应该使用window.getComputedStyle()来获取变量的值。
  • setProperty()方法接受的第二个参数是一个可选的优先级参数,用于指定样式的来源(如userauthoranimation等)。在大多数情况下,你可以忽略这个参数。




在JavaScript中,可以使用getComputedStyle方法来获取CSS中的变量。下面是一个示例代码:

// 获取CSS变量的值
const element = document.querySelector('.element');
const styles = getComputedStyle(element);
const variableValue = styles.getPropertyValue('--variable-name');

// 使用获取到的变量值
console.log(variableValue);

在上面的代码中,首先使用querySelector方法选择要获取变量的元素。然后,使用getComputedStyle方法获取该元素的计算样式。最后,使用getPropertyValue方法传入变量名来获取变量的值。

请注意,变量名需要以双横线(–)开头。在上面的代码中,--variable-name是一个示例变量名,你需要将其替换为你实际使用的变量名。




在JavaScript中设置CSS变量的值可以通过以下几种方法实现:

  1. 使用style属性直接设置元素的CSS变量值:
element.style.setProperty('--variable-name', 'value');

其中,element是要设置CSS变量的元素,--variable-name是CSS变量的名称,value是要设置的值。

  1. 使用document.documentElement.style.setProperty()方法设置全局的CSS变量值:
document.documentElement.style.setProperty('--variable-name', 'value');

这种方法会将CSS变量的值应用到整个文档中。

  1. 使用CSSStyleSheet.insertRule()方法动态插入CSS规则来设置CSS变量的值:
const styleSheet = document.styleSheets[0];
styleSheet.insertRule(':root { --variable-name: value; }', styleSheet.cssRules.length);

其中,:root选择器表示文档的根元素,--variable-name是CSS变量的名称,value是要设置的值。

  1. 使用CSSStyleSheet.addRule()方法动态添加CSS规则来设置CSS变量的值:
const styleSheet = document.styleSheets[0];
styleSheet.addRule(':root', '--variable-name: value;');

这种方法与上一种方法类似,只是使用了不同的语法。

请注意,以上方法中的--variable-name是CSS变量的名称,value是要设置的值。你可以根据需要自行替换。




如何用Js设置和获取CSS的变量

可以使用JavaScript来设置和获取CSS变量。下面是一个示例:

设置CSS变量:

document.documentElement.style.setProperty('--footer-color', 'blue');

获取CSS变量:

var footerColor = getComputedStyle(document.documentElement).getPropertyValue('--footer-color');
console.log(footerColor);

这里的--footer-color是一个CSS变量的名称,可以根据需要自定义。通过setProperty方法可以设置CSS变量的值,而getComputedStyle方法可以获取CSS变量的值。

在JavaScript中设置和获取CSS变量(也称为CSS自定义属性)可以通过操作元素的style属性或使用getPropertyValuesetProperty方法来完成。CSS变量通常以两个连字符开头(例如,--my-variable)。

设置CSS变量

要设置CSS变量,可以直接在元素的style属性上设置它,或者使用CSSStyleDeclarationsetProperty方法。

示例1:通过style属性设置
// 获取元素
const element = document.querySelector('.my-element');

// 设置CSS变量
element.style.setProperty('--my-variable', '10px');
示例2:通过style属性直接设置(注意:这种方法可能不被所有浏览器支持)
// 获取元素
const element = document.querySelector('.my-element');

// 设置CSS变量(注意:这种方法可能不起作用,因为CSS变量名通常包含连字符)
// 更推荐使用 setProperty 方法
element.style['--my-variable'] = '10px'; // 可能不起作用

获取CSS变量

要获取CSS变量的值,可以使用CSSStyleDeclarationgetPropertyValue方法。

示例:获取CSS变量的值
// 获取元素
const element = document.querySelector('.my-element');

// 获取CSS变量的值
const value = element.style.getPropertyValue('--my-variable');

console.log(value); // 输出:10px(如果之前设置了该值)

注意事项

  • 当你在JavaScript中通过element.style设置CSS变量时,你是在元素的行内样式上设置它。这意味着它将覆盖在外部或内部样式表中为该元素设置的相同CSS变量。
  • 如果你想要获取在外部或内部样式表中设置的CSS变量的值,而不是行内样式中设置的值,你可能需要使用getComputedStyle方法。
示例:使用getComputedStyle获取CSS变量的值
// 获取元素
const element = document.querySelector('.my-element');

// 获取计算后的样式
const computedStyle = getComputedStyle(element);

// 获取CSS变量的值
const value = computedStyle.getPropertyValue('--my-variable');

console.log(value); // 输出在样式表中设置的值,或者如果没有设置则输出默认值




如何用Js操作style标签

在JavaScript中操作<style>标签可以通过多种方式实现,包括创建新的<style>元素、修改现有的<style>元素的内容,或者使用CSSOM(CSS Object Model)来动态地改变样式。以下是一些基本示例:

创建并添加新的<style>元素

你可以创建一个新的<style>元素,设置其innerHTML来包含CSS规则,然后将其添加到DOM中。

// 创建一个新的<style>元素
const styleElement = document.createElement('style');

// 设置<style>元素的CSS内容
styleElement.innerHTML = `
  body {
    background-color: lightblue;
  }
`;

// 将<style>元素添加到<head>中
document.head.appendChild(styleElement);

修改现有的<style>元素

如果你已经有一个<style>元素并且想要修改它的内容,你可以通过选择该元素并更改其innerHTML来实现。

// 获取现有的<style>元素(假设它有一个id)
const existingStyleElement = document.getElementById('my-style');

// 修改<style>元素的CSS内容
existingStyleElement.innerHTML = `
  h1 {
    color: red;
  }
`;

使用CSSOM动态改变样式

除了直接操作<style>标签外,你还可以使用CSSOM来动态地改变页面上元素的样式。这通常是通过修改元素的style属性来实现的。

// 获取元素并改变其样式
const myElement = document.getElementById('my-element');
myElement.style.backgroundColor = 'yellow'; // 将背景色改为黄色
myElement.style.fontSize = '20px'; // 更改字体大小

请注意,通过元素的style属性设置的样式是内联样式,它们会覆盖外部和内部样式表中的样式(除非后者使用了!important规则)。

操作<style>标签中的特定规则

如果你想要更精细地控制<style>标签中的CSS规则,你可能需要使用更高级的CSSOM方法,如insertRuledeleteRule。这些方法允许你向现有的<style>元素添加或删除特定的CSS规则。

// 获取现有的<style>元素(或创建一个新的)
const styleElement = document.getElementById('my-style') || document.createElement('style');
document.head.appendChild(styleElement); // 如果是新创建的,则添加到<head>中

// 获取<style>元素的sheet属性(一个CSSStyleSheet对象)
const styleSheet = styleElement.sheet;

// 使用insertRule方法添加一个新的CSS规则
styleSheet.insertRule('p { color: green; }', 0); // 在规则列表的开头添加新规则

// 使用deleteRule方法删除一个CSS规则(需要知道规则的索引)
// styleSheet.deleteRule(0); // 删除索引为0的规则(这里只是演示,实际上你可能不想立即删除它)

请注意,insertRuledeleteRule方法可能因浏览器而异,并且在使用它们时需要确保<style>元素已经被添加到文档中(即其sheet属性是可访问的)。

让我们逐一了解CSSStyleElementinsertRule()以及CSSStyleDeclaration

CSSStyleElement

CSSStyleElement是表示HTML <style> 元素的接口。这个接口继承自HTMLElement,并且添加了与样式表相关的属性和方法。虽然实际上在浏览器中并不存在名为CSSStyleElement的具体接口(截至我的最后更新日期),但<style>元素通常是通过HTMLStyleElement接口来表示的。这可能是对HTMLStyleElement的一个误解或混淆。

HTMLStyleElement具有一些属性和方法,如sheet,它返回一个CSSStyleSheet对象,代表该<style>元素包含的样式表。

insertRule()

insertRule()方法是CSSStyleSheet接口的一部分,而不是CSSStyleElementHTMLStyleElement。这个方法用于向样式表中插入新的CSS规则。它接受两个参数:

  1. rule:一个字符串,表示要插入的CSS规则。
  2. index:一个整数,表示在样式表的哪个位置插入新规则。如果省略此参数,则新规则将被添加到样式表的末尾。

使用insertRule()的一个例子:

// 假设我们有一个<style>元素
let styleElement = document.querySelector('style');

// 获取与该<style>元素相关联的样式表
let styleSheet = styleElement.sheet;

// 使用insertRule()在样式表的开头插入一条新规则
styleSheet.insertRule('body { background-color: lightgreen; }', 0);

这将把背景颜色设置为浅绿色的规则添加到<style>元素关联的样式表的开头。

CSSStyleDeclaration

CSSStyleDeclaration是一个接口,表示一个CSS声明块,它是一个包含一组CSS属性和值的对象。通常,你可以通过访问HTML元素的style属性来获取一个CSSStyleDeclaration对象。这个对象包含一组对应于CSS属性和值的方法和属性,允许你读取、修改和添加内联样式。

例如:

// 获取一个HTML元素
let element = document.querySelector('div');

// 获取该元素的CSSStyleDeclaration对象
let style = element.style;

// 设置背景颜色和内边距
style.backgroundColor = 'red';
style.padding = '10px';

在这个例子中,element.style返回一个CSSStyleDeclaration对象,我们可以使用它来修改元素的内联样式。注意,这里修改的是元素的内联样式,而不是在<style>标签或外部样式表中定义的样式。

总结一下,虽然你可能在查找资料时遇到了混淆或误解,但希望以上关于HTMLStyleElementinsertRule()CSSStyleDeclaration的解释能够帮助你更好地理解它们在CSS和JavaScript中的用途和工作方式。









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

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

相关文章

如何创建WordPress付款表单(简单方法)

您是否正在寻找一种简单的方法来创建付款功能WordPress表单&#xff1f; 小企业主通常需要创建一种简单的方法来在其网站上接受付款&#xff0c;而无需设置复杂的购物车。简单的付款表格使您可以轻松接受自定义付款金额、设置定期付款并收集自定义详细信息。 在本文中&#x…

QT编写工具基本流程(自用)

以后有人让你写工具的时候&#xff0c;可以方便用这个模版及时提高工作效率&#xff0c;可以争取早点下班。包含库目录&#xff0c;头文件目录&#xff0c;输出目录以及翻译和部署&#xff0c;基本上都全了&#xff0c;也可以做收藏用用。 文章目录 1、创建项目Dialog Widget都…

Vue | (三)使用Vue脚手架(上) | 尚硅谷Vue2.0+Vue3.0全套教程

文章目录 &#x1f4da;初始化脚手架&#x1f407;创建初体验&#x1f407;分析脚手架结构&#x1f407;关于render&#x1f407;查看默认配置 &#x1f4da;ref与props&#x1f407;ref属性&#x1f407;props配置项 &#x1f4da;混入&#x1f4da;插件&#x1f4da;scoped样…

element-plus日期选择器2次封装

预期效果 官网默认样式&#xff1a; 修改后的样式&#xff1a; 代码实现 DatePicker.vue <template><div class"date-picker-container"><el-date-picker v-model"date" change"handleChange" type"date" value-for…

TypeScript中的Omit、Pick、Partial、Required类型

首先有这么个人员接口 interface IInfo {name: string; // 姓名age: number; // 年龄height: string; // 身高phone: string; // 联系电话email: string; // 邮箱 } 1. Omit Omit类型可以从一个对象类型中 忽略某些属性 假设我们使用IInfo接口&#xff0c;但是不想要其中p…

OpenAI文生视频物理世界模型——Sora降世,AI视频领域降维打击令五大行业一夜变天!

年初六&#xff0c;OpenAI发布了“文生视频”的工具&#xff0c;Sora。AI技术变革又一次震撼了整个世界。或许你又开始担心&#xff0c;AI发展那么快&#xff0c;将会取代自己。但请记住&#xff0c;危机时代也是变革时代&#xff0c;变革就是机会。开工第一天&#xff0c;相信…

搜狗的workflow的简单使用

workflow是一个网络库&#xff0c;是一个基于C在在线服务引擎 GitHub官网 运行hello world 1,创建一个server&#xff0c;构造函数入参传入一个入参是task的lamda函数&#xff0c;函数的内容会拿到response&#xff0c;并且可以在response中写body 2、server启动&#xff0c;…

Vue中$root的使用方法

查看本专栏目录 关于作者 还是大剑师兰特&#xff1a;曾是美国某知名大学计算机专业研究生&#xff0c;现为航空航海领域高级前端工程师&#xff1b;CSDN知名博主&#xff0c;GIS领域优质创作者&#xff0c;深耕openlayers、leaflet、mapbox、cesium&#xff0c;canvas&#x…

XR行业首家|李未可科技通过深度合成服务算法备案

2月18日&#xff0c;国家网信办发布第四批深度合成服务算法备案。 根据《互联网信息服务深度合成管理规定》第十九条规定&#xff0c;具有舆论属性或者社会动员能力的深度合成服务提供者&#xff0c;应当按照《互联网信息服务算法推荐管理规定》履行备案和变更、注销备案手续。…

探索海洋世界,基于YOLOv5全系列【n/s/m/l/x】参数模型开发构建海洋场景下海洋生物检测识别分析系统

前面的博文中&#xff0c;开发实践过海底相关生物检测识别的项目&#xff0c;对于海洋场景下的海洋生物检测则很少有所涉及&#xff0c;这里本文的主要目的就是想要开发构建基于YOLOv5的海洋场景下的海洋生物检测识别系统。 前文相关的开发实践如下&#xff0c;感兴趣的话可以…

【DDD】学习笔记-应用服务

Eric Evans 为运用领域驱动设计的系统架构划定了层次&#xff0c;在领域层和展现层之间引入了应用层&#xff08;Application Layer&#xff09;&#xff1a;“应用层要尽量简单&#xff0c;不包含业务规则或者知识&#xff0c;而只为下一层&#xff08;指领域层&#xff09;中…

左右联动布局效果

效果图&#xff1a; <template><el-dialog :modelValue"modelValue" :before-close"close" fullscreen :close-on-click-modal"false"><div class"farmer_detail"><div class"info_content"><di…

STM32入门教程:新建工程

本博文是基于建立好STM32的keil5软件后建立工程&#xff0c;如果还没下载软件建议先下载好该软件&#xff0c;在 B站江科大32教学有&#xff0c;并把相关文件下好。 STM32的开发方式有&#xff1a;基于寄存器的方式&#xff0c;基于标准库也就是库函数的方式&#xff0c;基于…

MySQL错误-this is incompatible with sql_mode=only_full_group_by完美解决方案

项目场景 有时候&#xff0c;遇到数据库重复数据&#xff0c;需要将数据进行分组&#xff0c;并取出其中一条来展示&#xff0c;这时就需要用到group by语句。 但是&#xff0c;如果mysql是高版本&#xff0c;当执行group by时&#xff0c;select的字段不属于group by的字段的…

NLP_BERT与GPT争锋

文章目录 介绍小结 介绍 在开始训练GPT之前&#xff0c;我们先比较一下BERT和 GPT 这两种基于 Transformer 的预训练模型结构&#xff0c;找出它们的异同。 Transformer架构被提出后不久&#xff0c;一大批基于这个架构的预训练模型就如雨后春笋般地出现了。其中最重要、影响…

【PHP】web服务器支持PHP_环境配置

一、PHP运行目前为止主要有4方式 &#xff08;1&#xff09;以模块加载的方式运行&#xff0c;初学者可能不容易理解&#xff0c;其实就是将PHP集成到Apache服务器&#xff0c; 以同一个进程运行。 &#xff08;2&#xff09;以CGI的方式运行&#xff0c;CGI英文叫…

【MATLAB】BiGRU神经网络回归预测算法

有意向获取代码&#xff0c;请转文末观看代码获取方式~也可转原文链接获取~ 1 基本定义 BiGRU神经网络回归预测算法是一种基于双向门控循环单元&#xff08;GRU&#xff09;的多变量时间序列预测方法。该方法结合了双向模型和门控机制&#xff0c;旨在有效地捕捉时间序列数据中…

两个发散级数的和是否发散?

1、两个发散级数的和可能是收敛的也可能是发散的。 例子&#xff1a; 发散级数 ∑ 1 n \sum\frac{1}{n} ∑n1​和发散级数 ∑ ( 1 n 2 − 1 n ) \sum(\frac{1}{n^{2}}-\frac{1}{n}) ∑(n21​−n1​)的和是收敛级数&#xff1b; 发散级数∑(1/n) 和发散级数 ∑(1/n1/n) 的和是…

HarmonyOS 鸿蒙应用开发(十一、面向鸿蒙开发的JavaScript基础)

ArkTS 是HarmonyOS&#xff08;鸿蒙操作系统&#xff09;原生应用开发的首选语言。它是用于构建用户界面的一种TypeScript方言&#xff0c;扩展了TypeScript以适应HarmonyOS生态系统的UI开发需求。ArkTS 融合了TypeScript的静态类型系统和现代UI框架的设计理念&#xff0c;为开…

Redis 缓存(Cache)

什么是缓存 缓存(cache)是计算机中的一个经典的概念在很多场景中都会涉及到。 核心思路就是把一些常用的数据放到触手可及(访问速度更快)的地方&#xff0c;方便随时读取。 这里所说的“触手可及”是个相对的概念 我们知道&#xff0c;对于硬件的访问速度来说&#xff0c;通常…