自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 vue3+ts 使用echarts 画圆柱状图

效果图如下:代码如下<script lang="ts" setup> import { reactive, ref, toRefs, onMounted } from 'vue'; import * as echarts from 'echarts'; // 获取echarts的dom元素 let chartRef = ref(); // 定义收益柱状图数据 let profit = reactive({ title: { text: .

2022-04-25 15:09:13 2107 3

原创 Vue3项目自定义代码块

话不多说,上图试试看↓{ "demo":{ "prefix": "v3", "body": [ "<template>", "\t", "</template>", "", "<script lang='ts'>", "import {defineComponent }from 'vue'", "export default defineComponent({", "\tsetup(){", ..

2022-04-19 10:04:05 1281

原创 vue3 中获取router

先导入vue-router 里的useRouter import {useRouter} from 'vue-router'import {useRouter} from 'vue-router'setup(){ const router =useRouter() watch(()=>{ console.log(router) return router.currentRoute.value },(value)=>{ }) ..

2022-04-07 10:56:50 6619

原创 js中的DOM-3-操作元素2(实例)(初学)

续 操作元素一、密码框验证信息分析:先判断的事件是表单失去焦点onblur 如果输入正确提示正确的信息颜色为绿色小图标变化 如果输入不是6—16位,则提示错误信息颜色为红色小图标变化 更改样式较多,所以采用className修改样式<style> div { width: 600px; margin: 100px auto; float: left; } .

2021-09-09 16:43:45 106

原创 js中的DOM-3-操作元素1(初学)

JavaScript的DOM操作可以改变网页内容、结构和样式,可以利用DOM操作元素来改变元素里面的内容、属性等。注:以下都是属性1.改变元素内容

2021-09-09 15:17:15 162

原创 js中的DOM-2-事件基础(初学)

1.事件的概述:JavaScript使我们有能力创建动态页面,而事件是可以被JavaScript侦测到的行为。简单理解:触发—响应机制2.事件的三部分组成(三要素):事件源、事件类型、事件处理程序例:点击一个按钮,弹出对话框则:(1).事件源是 事件被触发的对象,即(谁) → 按钮 (2).事件类型是 如何触发,什么事件 如同:鼠标点击(onclick) 还是 鼠标经过(onmouseover) 还是鼠标离开(onmouseout) ↓ (3). 事件处理程序 ...

2021-09-03 01:21:09 142

原创 js中的DOM-1-获取元素(初学)

一、DOM获取元素DOM在实际开发中主要用来操作元素获取页面中的元素方法:根据 ID 获取 根据标签名获取 通过 HTML5 新增的方法获取 特殊元素获取1.根据 ID 获取 :使用getElementById()方法获取元素对象...

2021-09-03 00:25:34 580

原创 js中的DOM简介(初学)

一、DOM:文档对象模型(Document ObjectModel,简称DOM),是W3C组织推荐的处理可扩展标记语言(HTML或者XML)的标准编程接口W3C已经定义了一系列的DOM接口,通过这些DOM接口可以改变网页的内容、结构和样式。一.2 DOM树:文档:一个页面就是一个文档,DOM中使用 document 表示 元素:页面中的所有标签都是元素,DOM中使用 element 表示 节点:网页中的所有内容都是节点(标签、属性、文本、注释等),DOM中使用node表示DOM把以上内容

2021-08-21 13:14:17 168

原创 API 和 Web APl

API(Application Programming Interface,应用程序接口)是一些预先定义的接口(如函数、HTTP接口),或指软件系统不同组成部分衔接的约定。用来提供应用程序与开发人员基于某软件或硬件得以访问的一组例程,而又无需访问源码,或理解内部工作机制的细节。即:API是给程序员提供 第一种工具,以便能更轻松的实现想要完成的功能。 其实API就是一种工具,其使用接口进行实现的。Web APl 是浏览器提供的一套操作浏览器功能和页面元素的APl(BOM 和 D...

2021-08-21 12:51:39 226

原创 Web APls 和 js 基础关联性

一、JS的组成Web APls是w3c组织的标准 其主要学习DOM 和 BOM 是JS所独有的部分 主要学习页面交互功能 需要使用js基础的课程做基础JS 基础学习 ECMAScript 基础语法为后面作铺垫,Web APls 是 JS 的应用,大量使用 JS 基础语法作交互效果...

2021-08-21 12:42:35 149

原创 js中的 简单数据类型与复杂数据类型(初学)

一、简单的数据类型又叫做 基本数据类型 或者 值类型; 复杂类型又叫做 引用类型值类型:简单数据类型/基本数据类型,在变量存储的时候是个指,所以也叫值类型| string,number,boolean,undefined,null 其中 null 特殊: [返回的是一个对象] 所以以后如果有个变量打算存储为对象,但暂时也没想 好放啥,就可以先用null 引...

2021-08-21 12:31:35 174

原创 js中的字符串对象-2(初学)

一、字符串操作方法(重点)(拼接)↓concat() 【用+号连也可以】substr(‘截取的起始的位置’,‘截取几个字符’) 第一个3是索引号3;第二个4是取4个字符(替换)↓↓replace('被替换的字符','替换为的字符') 【它只会替换第一个字符】例:将字符串'abcoefoxyozzopp' 中的o全转换成# 【该方法可以后期用来过滤掉敏感词】split('分隔符') 之前用join('分隔符')将数组转换为字符串split('分隔符') 中...

2021-08-20 21:01:48 83

原创 js统计出现次数最多的字符案例(初学)

判断一个字符串‘abcoefoxyozzopp’中出现次数最多的字符,并统计其次数。核算算法:利用charArt() 遍历该字符串 把每个字符都存储给对象,如果对象没有该元素,就为1,存在了就+1 遍历对象,得到最大值和该字符接着利用对 对象 的遍历来取得出现次数最多的 (for k in o)var str = 'abcoefoxyozzopp';var o = {}; //因为最初是空对象for (var i = 0; i <= str.length; i++) {.

2021-08-20 17:36:30 137

原创 js 根据字符返回位置 & 根据位置返回字符 案例 (初学)

一、根据字符返回当前位置(可用indexOf)例:查找字符串‘abcofoxyozzopp’中所有的o出现的位置以及次数核心算法:先查找第一个o出现的位置 然后只要 indexOf()返回的结果不是 -1 则继续往后查 又以为indexOf()只能查找到第一个,所以后的的查找,即要在当前索引号+1来继续找。二、根据位置返回字符(重点)三种方法:...

2021-08-20 16:07:50 417

原创 js中的字符串对象-1(初学)

一、基本包装类型即把简单的数据类型包装成为复杂的数据类型,这样,基本数据类型就有了属性和方法。str是一个简单的数据类型,按道理基本数据类型是没有属性和方法的,而对象才有属性和方法,但是上面的代码却可以执行即这是因为js会把基本数据类型包装为复杂数据类型,其执行效果如下:①> 生成临时变量,把简单的数据类型包装为复杂数据类型 var temp = new String('cccc');②> 赋值给声明的字符变量str = temp;③>销毁临时变量temp = nul.

2021-08-20 00:53:40 160

原创 js中的数组-4(初学)

数组转换为字符串toString() 把数组转换成字符串,逗号分隔每一项 join(‘分隔符’) 方法用于把数组中的所有元素转换为一个字符串。toString() ↓↓ (默认是用逗号,进行分隔的)join(‘分隔符’) ↓↓(想用什么符号进行分隔都可以)...

2021-08-19 22:36:04 79

原创 js中数组去重案例(初学)

目标:把旧的数组里面不重复的元素选取出来放到数组中,重复的元素只保留一个,放到新数组中去重。 核心算法:遍历旧数组,然后用旧数组元素去查询新数组,如果该元素在新数组里没有的,就添加进去,否则不添加。(利用 新数组.indexOf(数组元素) 如果返回-1 这说明新数组里没 有该元素)function unique(arr) { var newArray = []; for (var i =...

2021-08-18 20:10:57 159

原创 js中的数组-3(初学)

一、利用push进行筛选数组 (push依次往后加,所以无需担心序号问题)二、数组排序reverse() 颠倒数组中元素的顺序(即翻转数组),无需参数sort() 对数组的元素进行排序 (冒泡排序)升序↓↓降序↓↓三、数组索引方法①indexOf(数组元素) 从数组中第一个元素查起 如果存在,则返回索引号;如果不存在,则返回-1 (存在相同的数组元素时,它只返回第一个满足条件的索引号)②lastInd...

2021-08-18 19:36:39 73

原创 js中的数组-2(初学)

一、添加删除数组元素方法一.1添加数组元素的方法:push() 在我们数组的末尾添加一个或多个数组元素(1).push()参数直接写数组元素就可以了(2).push完毕之后,返回的结果是新组数的长度(3).原数组也会发生变化push() ↓↓unshift()在我们数组前面添加一个或多个数组元素(1).unshift()参数直接写数组元素就可以了(2).unshift完毕之后,返回的结果也是数组的长度(3).原数组也会发生变化unshift() ↓↓一...

2021-08-18 15:37:07 89

原创 js中的数组-1(初学)

数组:是指一组数据的集合,其中的每个数据被称作为元素,在数组中可以存放任意类型的元素 数组是一种将一组数据存储在单个变量名下的优雅方式创建数组的方式:利用数组字面量创建数组 利用new创建数组1.利用数组字面量创建数组...

2021-08-18 14:59:55 613

原创 用js写倒计时案例(初学)

核心算法:输入的时间减去现在的时间即是剩余的时间,即为倒计时,但是不能拿着时分秒相减,如05分—25分,这样结果会是负数的 所以用时间戳来做。即用户输入时间总的毫秒数—现在时间总的毫秒数,得到的就是剩余时间的毫秒数。 再将剩余时间的毫秒数(将毫秒数/1000后用公式)转换为天、时、分、秒(即时间戳转换时分秒) 转换公式: d = parseInt(总秒数/60/60/24) →天数 d = parseInt(总秒数/60/60%24) →小时 d = parseInt(总秒数/60%...

2021-08-18 00:47:46 558

原创 js中的日期Date对象(初学)

Date() 日期对象 是一个构造函数 必须使用new 来调用创建我们的日期对象 var date = new Date(); //创建了一个日期对象var arr = new Array(); //创建了一个数组对象var obj = new Object(); //创建了一个对象实例 若以常规函数调用它(即不加new操作符),则将返回一个字符串,而不是一个日期对象。 另外,Date()对象不像其他Javascript类型,Date()对象没有字面量格式。获取当前时间...

2021-08-17 15:36:15 276

原创 js中的预解析(初学)

JavaScript代码是由浏览器中的Javascript解析器来执行的。一、JavaScript解析器在运行JavaScript代码的时候分两步:预解析 和 代码执行预解析 js引擎 会把js 里面所有的 var 还有 function 提升到当前作用域的最前面 代码执行: 按照代码书写的顺序从上往下执行二、预解析分为: 变量预解析(变量提升)和 函数预解析(函数提升)1.变量提升: 即把所有的变量声明提升到当前的作用域最前面 不提升赋值操作2.函数提升:即把所有的函数声明提升..

2021-08-15 00:45:19 124 1

原创 js中arguments的使用(初学)

当我们不确定有多少个参数传递的适合,可用arguments来获取。在JavaScript中,arguments实际上其实当前函数的一个内置对象。只有函数才有arguments对象,而且是每个函数都内置了一个arguments对象,arguments对象中存储了传递的所有实参。↑ 伪数组 即并不是真正意义上的数组 ↓其具有数组 length 属性 按照索引的方式进行存储的 它没有真正数组的一些方法pop() push() 等等可以按照数组的方式遍历arguments↓利...

2021-08-10 00:22:24 104

原创 js的内置对象—Math(初学)

JavaScript中的对象分为三中:自定义对象、内置对象、浏览器对象内置对象:①就是指JS语言自带的一些对象,供开发者使用,并提供了一些常用的或是最基本而必 要的功能(属性和方法) ②最大的优点就是帮助我们快速开发JavaScript提供了多个内置对象:Math、Data、Array、String等Math对象(数学对象:它具有数学常数和函数的属性和方法。不是一个函数对象)!!!(其不是一个构造函数,所以不需要new来调用,而是直接使用里面的属性和方...

2021-08-09 23:53:58 362

原创 js中的作用域(初学)

JavaScript作用域:即代码名字(变量)在某个范围内起作用和效果目的:为了提高程序的可靠性,更重要的是减少命名冲突js的作用域(es6)之前:全局作用域 局部作用域全局作用域:整个script标签 或者是一个单独的js文件 局部作用域(函数作用域):在函数内部就是局部作用域 该代码的名字只在函数内部起效果和作用变量的作用域1、全局变量:在全局作用域下的变量 在代码的任何位置下都可以使用 ↓(if在函数内部 没有声明变量就直接赋值的变量也属于全局变量!) ↓...

2021-08-08 00:04:41 425

原创 JS中创建对象(Object)的三种方式(初学)

1.字面量创建对象 (var obj = {};) ↓即 花括号{} 里面包含了表达这个具体事物(对象)的属性和方法。2.new Object 创建对象

2021-08-04 21:30:08 3758 1

原创 数据类型在Console中的颜色

console.log(18); //数字型是蓝色console.log('18'); //字符串黑色console.log(true); //布尔是深蓝console.log(undefined); // 浅灰console.log(null);//浅灰

2021-07-18 14:08:06 1242 1

原创 IsNaN()

↓用来判断非数字的 → x是数字,返回falseisNaN(x) { → x不是数字,返回true

2021-07-18 00:36:52 78

空空如也

空空如也

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

TA关注的人

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