自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(42)
  • 收藏
  • 关注

原创 promise基础及理论 代码示例

【代码】promise基础及理论 代码示例。

2024-05-21 15:27:23 219 2

原创 Vue3中引入echarts时 有关生命周期(挂载)的问题

onMounted

2024-04-11 11:41:41 250

原创 echarts坐标轴、轴线、刻度、刻度标签

x 轴和 y 轴都由四个部分组成。部分图表中还会有网格线来帮助查看和计算数据当 x 轴(水平坐标轴)跨度很大,可以采用。在二维数据中,轴也可以有多个。ECharts 中一般情况下多于两个 x/y 轴需要通过配置 offset 属性防止同个位置多个轴的重叠。。

2024-04-10 16:08:39 937

原创 记录(Vue3中常用的组合式API)

以上例子中,使用axios库进行了一个API请求,尝试检索数据,任何错误都被记录到控制台。计算属性依赖于其他响应式数据,并且只有在依赖发生变化时才会重新计算值。在Vue组件中进行API请求和管理异步操作时,可以使用像axios这样的库。以上,定义了一个名为squared的计算属性,表示count的平方。,可以使数据管理变得更加便利。通过组合式API提供的。这个函数是API创建的。

2024-03-19 16:45:38 217

原创 TodoList案例——静态组件

1、实现静态组件:抽取组件,使用组件实现静态页面效果。2.1数据的类型、名称是什么?3、交互——从绑定事件监听开始。2.2数据保存在哪个组件?

2024-03-12 15:02:29 346

原创 属于前端程序员的浪漫代码(致敬爱的师父篇)

炫酷爱心代码(含Canvas GL和各种网页链接等)<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=

2024-03-05 16:45:08 457 1

原创 子组件通过 $emit 触发父组件3.5日学习记录打卡

【代码】子组件通过 $emit 触发父组件3.5日学习记录打卡。

2024-03-05 16:42:23 487

原创 Vue基础练习 组件之间数据传递

/

2024-03-01 18:00:44 732

原创 组件(Prop、$emit)父子组件之间传值、import在vue中使用

父组件的数据需要通过 props 把数据传给子组件,子组件需要显式地用 props 选项声明 “prop”,

2024-02-22 14:46:46 393 2

原创 一些实用快捷键、生命周期钩子函数、计算属性

1.根据render()渲染函数,生成“抽象语法树AST”(此时还是带有指令的),再把AST第一次创建成“虚拟DOM(VNode1)”(Vnode是真实DOM的一种数据描述,它本质上是json格式的数据)在这个阶段,实例的属性和方法还未被创建。2.使用大名鼎鼎的Diff运算,patch(old Vnode,new Vnode),找出两个Vnode最小差异,合并Vnode,生成新的Vnode,删除旧的Vnode。: 在实例销毁后被调用。在这个阶段,实例的所有指令和事件监听器都已被移除,所有子实例也会被销毁。

2024-01-26 13:55:10 850 1

原创 v-on、事件修饰符、v-model、一些常用指令

Vue.js 为 v-on 提供了事件修饰符来处理 DOM 事件细节,如:event.preventDefault() 或 event.stopPropagation()。Vue.js 通过由点 . 表示的指令后缀来调用修饰符。

2024-01-24 17:12:03 406 2

原创 V-bind缩写、V-on缩写、V-if、V-show、V-for、Computed计算属性、methods属性、监听属性watch实例

声明了一个计算属性 reversedMessage。提供的函数将用作属性 vm.reversedMessage 的 getter。vm.reversedMessage 依赖于 vm.message,在 vm.message 发生改变时,vm.reversedMessage 也会更新。

2024-01-23 16:04:06 445

原创 Vue (v-bind指令、el与data的两种写法、理解MVVM、数据代理、V-no事件处理、双向数据绑定V-model、登陆页面实现

【代码】Vue (v-bind指令、el与data的两种写法、理解MVVM、数据代理、V-no事件处理、双向数据绑定V-model、登陆页面实现。

2024-01-22 17:24:42 491

原创 窗口尺寸事件resize、日期对象的使用Date、时间戳、下班倒计时案例

窗口尺寸改变事件日期对象的使用Date日期对象方法时间戳下班倒计时案例<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</tit

2024-01-19 16:38:30 378

原创 事件流、事件冒泡、事件捕获、鼠标经过事件、 mouseover和mouseenter的区别、事件委托、阻止默认行为(阻止冒泡)、页面加载、滚动、尺寸

分为捕获阶段和冒泡阶段</</.fatherwidth;height;;.sonwidth;height;;</</</const'.father'const'.son''click'functionalert'我是爷'true'click'functionalert'我是爹'true'click'functionalert'我是儿'true</</</

2024-01-18 17:10:45 424

原创 间歇函数setInterval、定时器、阅读间歇事件(按钮60秒后才能使用)、事件监听(绑定)addEventListener、事件类型、焦点事件、键盘事件focus、环境对象This、回调函数

使用getElementById()方法获取了ID为myButton的按钮元素,并使用addEventListener()方法在其上添加了一个点击事件监听器。// //每个函数里面都有this 环境对象 普通函数里面的this指向的是window。// window.fn()//window对象。keydown:用户按下了键盘上的某个键。mousedown:用户按下了鼠标按钮。keyup:用户释放了键盘上的某个键。//需求:点击按钮 弹出一个对话框。//定时器停了 我就可以开按钮了。

2024-01-17 15:35:39 924

原创 实现图片点击切换、通过classList修改样式、操作表单元素属性、自定义属性

输出结果为。

2024-01-16 17:32:02 523

原创 DOM、BOM、计算时间机器案例(包括正反)

innerHTML:表示元素内部的 HTML 内容,可以读取或修改元素的 HTML 内容。getElementById():通过元素的 ID 获取对应的 DOM 对象。querySelector():通过 CSS 选择器获取对应的 DOM 对象。document:表示整个文档对象,用于访问和操作整个网页文档的内容和结构。textContent:表示元素的文本内容,可以读取或修改元素的纯文本内容。style:表示元素的样式属性对象,可以读取或修改元素的样式。2.DOM 的顶级对象是 document。

2024-01-15 23:45:22 381

原创 随机颜色生成、基本数据类型和引用数据类型、堆和栈区别

/否则是false 则返回rgb(255,255,255)//调用函数 getRandomColor(布尔值)//利用for循环,随机抽6次 累加到Str里面。//如果是true 则返回#ffffff。//random是数组的索引号 是随机的。//每次要随机从数组里面抽取一个。//自定义一个随机颜色的函数。

2024-01-12 16:08:02 852

原创 深浅拷贝、常见函数四种类型、渲染、渲染表格、for循环、foreach循环、内置对象、随机数函数

官网:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Math/PI#%E6%B5%8F%E8%A7%88%E5%99%A8%E5%85%BC%E5%AE%B9%E6%80%A7。如何生成0-10的随机数呢。如何生成N-M之间的随机数。如何生成5-10的随机数。

2024-01-11 15:38:24 921

原创 for循环嵌套、九九乘法表

当需要在代码中执行一系列重复的操作时,可以使用循环结构。其中一种常见的循环结构是嵌套的for循环,它可以用来处理多维数据结构或执行多层嵌套的任务。注:记住,在使用嵌套的for循环时要注意控制循环的层数和迭代次数,数组的平均值的结果是。

2024-01-10 01:05:35 895

原创 遍历数组练习(利用for循环、辨识break与continue的区别)

(3)当break出现在循环体中的switch语句体内时,起作用只是跳出该switch语句体,并不能终止循环体的执行。若想强行终止循环体的执行,可以在循环体中,但并不在switch语句中设置break语句,满足某种条件则跳出本层循环体。2、for循环的最大价值:循环数组,将数组【’马超‘’赵云‘’张飞‘‘关羽‘’黄忠‘依次打印出来】break和continue都是用来控制循环结构的,主要作用是。(2)不管是哪种循环,一旦在循环体中遇到break,系统将。switch中的continue。

2024-01-08 17:47:27 397

原创 Vue2JS基础( VUE特点、原型、原型链、Promise)

我们包装好的函数最后,会return出Promise对象,也就是说,执行这个函数我们得到了一个Promise对象。这与事件(Event)完全不同,事件的特点是,如果你错过了它,再去监听,是得不到结果的。Promise 是异步编程的一种解决方案,其实是一个构造函数,自己身上有all、reject、resolve这几个方法,原型上有then、catch等方法。其执行过程是:执行了一个异步操作,也就是setTimeout,2秒后,输出“执行完成”,并且调用resolve方法。如果只有一个参数,那也可以不用括号。

2024-01-02 17:26:07 964

原创 JS(数组、分支语句、事件)

数组数组对象的作用是:使用单独的变量名来存储一系列的值。var car1="Saab";var car2="Volvo";var car3="BMW";数组可以用一个变量名存储所有的值,并且可以用变量名访问任何一个值。数组中的每个元素都有自己的的ID,以便它可以很容易地被访问到。创建一个数组,有三种方法。下面的代码定义了一个名为 myCars的数组对象:1: 常规方式:var myCars=new Array();myCars[0]="Saab"; myCars[1]="

2023-12-26 17:48:15 54 3

原创 JS(运算符、语句)

可以根据表达式的个数,分为 一元运算符,二元运算符,三元运算符。判断一个变量num是否大于等于5并且小于等于10。赋值运算符,对变量进行赋值的运算符=自增: 符号 ++ 让变量的值加1。自减:符号 – 让变量的值减1。错误写法:5<num<10。的优先级是非常高的。根据条件执行语句,叫。

2023-12-25 17:25:09 23

原创 JS(五种基本数据类型等)

充分高校利用内存,更方便使用整体分为两大类:1.基本数据类型2.引用数据类型数字类型:(namber)整数,小数,正数,负数。数字可以有很多操作,比如乘法* 除法/ 加法+ 减法-等等所以经常和运算符一起数字运算符也叫计算圆的面积对话框中输入圆的半径,算出圆的面积并显示到页面字符串类型(string)通过**单引号(’ ')双引号(" ")或反引号(``)包裹的数据都叫字符串,**单引号和双引号没有本质上的区别,推荐使用单引号。

2023-12-22 17:24:55 37

原创 JS(语法规则)

向body输出内容页面弹出警告对话框显示一个对话框,对话框中包含一条文字信息,用来提示用户输入文字。

2023-12-21 16:30:20 22

原创 JS(输出、语法、变量、数据类型)

使用。

2023-12-11 16:25:40 52 1

原创 CSS3Flex弹性盒子

弹性盒子模型1.伸缩容器( flex container) :包裹伸缩项目的父元素。2.伸缩项目( flex item) :伸缩容器的每个子元素。3.轴(axis) :每个弹性盒子模型拥有两个轴。主轴(main axis) :伸缩项目沿其-次排列的轴被称为主轴。侧轴(cross axis) :垂直于主轴的轴被称为侧轴。4.方向(direction) :伸缩容器的主轴由主轴起点和主轴终点,侧轴由侧轴起点和侧轴终点描述伸缩项目排列的方向。5.尺寸( dimension) :根据伸缩容器的主轴和侧轴

2023-12-11 09:09:07 33 1

原创 CSS3(图片、按钮、分页、框大小)

1.圆角图片2.椭圆形图片3.缩略图img {< img src=“图片” alt=“标记”>4.缩略图作为链接a {a:hover {< /a>5.响应式图片响应式图片会自动适配各种尺寸的屏幕。实例中,你可以通过重置浏览器大小查看效果,如果你需要自由缩放图片,且图片放大的尺寸不大于其原始的最大值,则可使用以下代码:height:auto;

2023-12-07 14:25:05 107 1

原创 CSS3(文本效果、字体、2D3D转换过度、动画、过渡)

text-shadowbox-shadowtext-overflowword-wrapword-break写 box-shadow 的依次顺序为:h-shadow v-shadow blur spread color insect水平阴影 垂直阴影 模糊 阴影尺寸 颜色 外阴影转到内阴影在新的 @font-face 规则中,您必须首先定义字体的名称(比如 myFirstFont),然后指向该字体文件,如需为 HTML 元素使用字体,请通过 font-fam

2023-12-06 14:50:26 110 1

原创 CSS3(边框、圆角*、背景、渐变*)

DOCTYPE html > < html > < head > < meta charset = " utf-8 " > < title > 不同角度渐变 </ title > < style > #grad1 {} #grad2 {} #grad3 {} #grad4 {

2023-12-05 14:18:54 141 1

原创 CSS(4)display显示、posttion定位、overflow布局、float浮动

Display显示与Visibility可见性display属性设置一个元素应如何显示visibility属性指定一个元素应可见还是隐藏。隐藏元素-display:none或visibility:hidden隐藏一个元素可以通过把display属性设置为"none",或把visibility属性设置为"hidden"。但是请注意,这两种方法会产生不同的结果。visibility:hidden可以隐藏某个元素,但隐藏的元素仍需占用与未隐藏之前一样的空间。也就是说,该元素虽然被隐藏了,但仍然会影响布局

2023-12-04 15:25:34 264 1

原创 CSS(3)盒子、边框、margin外边距、padding填充

概念:所有的HTML元素都可以看成盒子,在CSS中是用来设计和布局时使用的,本质上是一个盒子,封装周围的HTML元素,它包括:边框,边距,填充,和实际内容。:CSS 没有定义 3 个关键字的具体宽度,所以一个用户可能把 thick 、medium 和 thin 分别设置为等于 5px、3px 和 2px,而另一个用户则分别设置为 3px、2px 和 1px。是一个简写属性,定义元素边框与元素内容之间的空间,即上下左右的内边距。margin 可以单独改变元素的上,下,左,右边距,也可以一次改变所有的属性。

2023-12-01 16:06:56 282 1

原创 CSS(2)

font-family 属性应该设置几个字体名称作为一种"后备"机制,如果浏览器不支持第一种字体,他将尝试下一种字体。能否管理文字的大小,在网页设计中是非常重要的。当text-align设置为"justify",每一行被展开为宽度相等,左,右外边距是对齐(如杂志和报纸)。虽然可以通过浏览器的缩放工具调整文本大小,但是,这种调整是整个页面,而不仅仅是文本,可以用。Remark 如果你不指定一个字体的大小,默认大小和普通文本段落一样,让页面排版更加合理,不影响文本的阅读,我们可以改变图像的位置。

2023-11-30 14:37:56 49 1

原创 CSS(列表)

在CSS中 分有序列表和无序列表,无序列表 ul - 列表项标记用特殊图形(如小黑点、小方框等)有序列表 ol - 列表项的标记有数字或字母使用 CSS,可以列出进一步的样式,并可用图像作列表项标记。

2023-11-29 16:24:40 64 1

原创 CSS(1)

CSS 优先规则4:计算选择符中 ID 选择器的个数(a),计算选择符中类选择器、属性选择器以及伪类选择器的个数之和(b),计算选择符中标签选择器和伪元素选择器的个数之和(c)。(这通常是个很糟糕的书写方式,它只能改变当前标签的样式,如果想要多个 < div> 拥有相同的样式,你不得不重复地为每个 < div> 添加相同的样式,如果想要修改一种样式,又不得不修改所有的 style 中的代码。多重样式:如果某些属性在不同的样式表中被同样的选择器定义,那么属性值将从更具体的样式表中被继承过来。

2023-11-29 15:20:28 25 1

原创 H5(2)

接下来我们将使用 JSON.stringify 来存储对象数据、JSON.stringify 可以将对象转换为字符串。1、保存数据:localStorage.setItem(key,value);3、删除单个数据:localStorage.removeItem(key);5、得到某个索引的key:localStorage.key(index);1、可以输入网站名,网址,以网站名作为key存localStorage;// 使用网站名作为key,将网址存入localStorage。

2023-11-28 17:33:07 24 1

原创 H5(1)

线条结束坐标绘制线条我们必须使用到 “ink” 的方法,就像stroke().

2023-11-27 15:01:35 28 1

原创 HTML333

html支持有序列表、无序列表、以及定义列表。1.首先是无序列表:无序列表是一个项目的列表,此列项目使用粗体圆点(典型的小黑圆圈)进行标记。无序列表使用 < ul > 标签2.然后是有序列表:同样,有序列表也是一列项目,列表项目使用数字进行标记。 有序列表始于 < ol> 标签。每个列表项始于 < li > 标签。列表项使用数字来标记。自定义列表不仅仅是一列项目,而是项目及其注释的组合。自定义列表以 < dl> 标签开始。每个自定义列表项以 < dt> 开始。每个自定义列表项的定义以 < dd>

2023-11-22 16:40:21 27 1

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除