自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 vue-cli自动打开默认浏览器0.0.0:8080问题

最近重新启了个项目,发现使用- -open时打开浏览器访问的是0.0.0:8080,然后上网搜到了解决办法,记录一下:

2022-07-08 10:48:47 826 1

原创 点击按钮刷新当前页面

参考链接:https://www.jb51.net/article/151984.htm

2021-12-17 09:43:03 809

原创 table中表头内容换行

第一步、给th加样式:.tabledragTh{ white-space: pre-wrap;}第二步、数据中换行:tableHeader: [ "Time", "10/12\nSchedule1", "10/12\nSchedule2", "11/12\nSchedule1", "12/12\nSchedule1", ],参考:作者地址...

2021-12-13 14:23:33 999

原创 高阶函数——函数柯里化

高阶函数如果一个函数符合下面2个规范中的任何一个,那该函数就是高阶函数1.若A函数,接收的参数是一个函数,那么A就可以称之为高阶函数2.若A函数,调用的返回值依然是一个函数,那么A就可以称之为高阶函数常见的高阶函数有:Promise、setTimeout、arr.map()等等函数的柯里化通过函数调用继续返回函数的方式,实现多次接收参数最后统一处理的函数编码形式例:<script> function sum(a){ return (b)=&

2021-11-23 16:48:53 366

原创 收集表单数据

非受控组件<div id="test"></div> <!-- 引入react核心库 --> <script crossorigin src="https://unpkg.com/react@17/umd/react.development.js"></script> <!-- 引入react-dom,用于支持react操作DOM --> <script crossorigin src="http

2021-11-23 16:17:51 550

原创 组件实例的三大属性

state<div id="test"></div> <!-- 引入react核心库 --> <script crossorigin src="https://unpkg.com/react@17/umd/react.development.js"></script> <!-- 引入react-dom,用于支持react操作DOM --> <script crossorigin src="http

2021-11-23 14:38:44 654

原创 react中定义组件

函数式组件<body> <div id="test"></div> <script crossorigin src="https://unpkg.com/react@17/umd/react.development.js"></script> <script crossorigin src="https://unpkg.com/react-dom@17/umd/react-dom.development.js"&gt

2021-11-22 17:22:06 298

原创 React JSX

全称:JavaScript XML是react定义的一种类似于XML的JS扩展语法:JS+XML本质是React.createElement(component,props,…children)方法的语法糖作用:用来简化创建虚拟DOM它不是字符串也不是HTML/XML标签;它最终产生的就是一个JS对象写法:var ele=Hello JSX!语法规则:1.定义虚拟DOM时,不要写引号;2.标签中混入JS表达式时要用{};3.样式的类名指定不要用class,要用className;4

2021-11-22 16:12:44 64

原创 简单实现在vue中引入echarts

一、npm安装输入命令:npm install echarts --save二、按需引入// 引入 echarts 核心模块,核心模块提供了 echarts 使用必须要的接口。 import * as echarts from "echarts/core";// 引入柱状图表import { BarChart } from "echarts/charts";// 引入 Canvas 渲染器,注意引入 CanvasRenderer 或者 SVGRenderer 是必须的一步import { C

2021-11-15 14:49:29 887

原创 vue项目部署iis服务器404问题

关于部署服务器404问题https://blog.csdn.net/bigbear00007/article/details/90718450

2021-09-09 14:28:48 582

原创 点击li切换颜色练习

div中:<ul> <li @click="fun(index)" :class="{'xuanzhong':dianIndex==index}" v-for='(items,index) in haizei'>{{items}}</li></ul>style中:.xuanzhong{ color: red;}script中: data:{ haizei:["路飞","乔巴","索隆","娜美","山治","乌索普

2021-03-24 17:42:13 125

原创 拖拽

var dragDiv=document.getElementById("box"); drag(dragDiv); function drag(obj){ obj.onmousedown=function(e){ // 设置obj捕获所有鼠标按下的事件 // 只有IE支持 obj.setCapture&&obj.setCapture()..

2021-03-19 14:16:50 93

原创 JS笔记_事件的绑定

addEventListener()通过这个方法也可以为元素绑定响应函数参数:1.事件的字符串,不要on2.回调函数,当事件触发时该函数会被调用3.是否在捕获阶段触发事件,需要一个布尔值,一般都传false使用addEventListener()可以同时为一个元素的相同事件绑定多个响应函数,这样当事件被触发时,响应函数将会按照函数的绑定顺序执行。这个方法不支持IE以下浏览器 btn01.addEventListener("click",function(){ al

2021-03-18 18:47:05 74

原创 JS笔记_事件的委派

指将事件统一绑定给元素共同的祖先元素,这样当后代元素上的事件触发时,会一直冒泡到祖先元素,从而通过祖先元素的响应函数来处理事件。事件委派是利用了冒泡,通过委派可以减少事件绑定的次数,提高程序的性能。<body> <div> <ul> <li><a href="javascript:;" class="link">超链接一</a></li> <l

2021-03-18 17:19:30 64

原创 div跟随鼠标移动

var div=document.getElementsByTagName("div")[0]; document.onmousemove=function(event){ // 兼容IE8以下 event=event||window.event; // 兼容火狐浏览器 var st=document.body.scrollTop||document.documentElement.scroll.

2021-03-18 16:42:52 90

原创 JS笔记_获取元素的样式的方法(兼容IE8)

// obj 要获取样式的元素 // name 要获取的样式名 function getStyle(obj,name){ if(window.getComputedStyle){ // 正常浏览器 return getComputedStyle(obj,null)[name]; }else{ // IE8

2021-03-18 12:39:00 327

原创 添加与删除

结构:<table border="1"> <tr> <th>Name</th> <th>Email</th> <th>Salary</th> <th></th> </tr> <tr> <td

2021-03-18 12:29:24 185

原创 全选练习

结构部分:<div id="container"> <p>你爱好的运动是?</p> <input type="checkbox" name="aon" id="aon" value="全选/全不选">全选/全不选<br> <input type="checkbox" name="hobby" id="football" value="足球">足球 <input ty

2021-03-17 15:31:36 89

原创 轮播图(点击按钮切换)

结构部分:<div id="container"> <p></p> <img src="./img/img1.jpg" alt=""> <div class="btn"> <button>上一张</button> <button>下一张</button> </div>

2021-03-17 13:26:28 1456

原创 JS笔记_正则表达式

正则表达式用于定义一些字符串的规则,计算机可以根据正则表达式,来检查一个字符串是否符合规则,获取将字符串中符合规则的内容提取出来。创建正则表达式对象语法:var 变量=new RegExp(“正则表达式”,“匹配模式”);使用typeof检查正则对象,会返回object。在构造函数中可以传递一个匹配模式作为第二个参数:i 忽略大小写g 全局匹配模式使用字面量来创建正则表达式语法:var 变量=/正则表达式/匹配模式使用字面量的方式创建更加简单,使用构造函数创建更加灵活(可以放变量)

2021-03-16 22:54:30 106

原创 JS笔记_字符串的方法

在底层,字符串是以字符数组的形式保存的[“H”,“e”,“l”]1.length属性可以用来获取字符串的长度2.charAt()可以返回字符串中指定位置的字符根据索引获取指定的字符

2021-03-16 16:59:12 63

原创 JS笔记_包装类

在JS中为我们提供了三个包装类,通过这三个包装类可以将基本数据转换为对象;1.String()可以将基本数据类型字符串转换为String对象2.Number()可以将基本数据类型的数字转换为Number对象3.Boolean()可以将基本数据类型的布尔值转换为Boolean对象但我们在实际应用中不会使用基本数据类型的对象,如果使用的话,在做一些比较时可能会带来一些不可预期的结果。方法和属性只能添加给对象,不能添加给基本数据类型;当我们对一些基本数据类型的值去调用属性和方法时,浏览器会临时使

2021-03-16 16:51:05 46

原创 JS笔记_Math

Math和其他的对象不同,它不是一个构造函数,它属于一个工具类不用创建对象,他里边封装了数学运算相关的属性和方法。比如:1.Math.PI表示圆周率2.Math.abs()可以用来计算一个数的绝对值3.Math.ceil()可以对一个数进行向上取整,小数位只要有值就自动进14.Math.floor()可以对一个整数进行向下取整,小数部分会被舍掉5.Math.round()可以对一个数进行四舍五入取整6.Math.random()可以用来生成一个0-1/0-10/0-x之间的随机数生

2021-03-16 16:42:54 49

原创 JS笔记_Date

在JS中使用Date对象来表示一个时间。创建一个Date对象如果直接使用构建函数创建一个Date对象,则会封装为当前代码执行的时间。var d=new Date();创建一个指定的时间对象需要在构造函数中传递一个表示时间的字符串作为参数日期的格式 月份/日/年 时:分:秒 var d=new Date("03/16/2021 11:36:38");getDate()获取当前日期是几日var date=d.getDate();getDay()获取当前日期是周几(会返回一个0-6

2021-03-16 11:56:46 81

原创 JS笔记_arguments

在调用函数时,浏览器每次都会传递进两个隐含的参数:1.函数的上下文对象,this2.封装实参的对象argumentsarguments是一个类数组对象,它也可以通过索引来操作数据,也可以获取长度,在调用函数时,我们所传递的实参都会在arguments中保存。arguments.length可以用来获取实参的长度;我们即使不定义形参,也可以通过arguments来使用实参,只不过比较麻烦。arguments[0]表示第一个实参,arguments[1]表示第二个形参…它里面有一个属性叫做call

2021-03-16 11:30:32 49

原创 JS笔记_call和apply

这两个方法都是函数对象的方法,需要通过函数对象来调用,当对函数调用call()和apply()时,都会调用函数执行。可以将一个对象指定为第一个参数,此时这个对象将会成为函数执行时的this. function fun(){ alert(this); } var obj={ }; // fun.apply(); // fun.call(); // fun(); fun.a

2021-03-16 11:18:28 53

原创 JS笔记_数组

数组也是一个对象,它和我们普通的对象功能相似,也是用来存储一些值的,不同的是普通对象是使用字符串作为属性名的,而数组是使用数字来作为索引操作元素。索引:从0开始的整数就是索引。数组的存储性能比普通对象要好,在开发中我们经常使用数组来存储一些数据。 // 创建一个数组 var arr=new Array(); // 向数组中添加元素 // 语法:数组[索引]=值; arr[0]=2; arr[1]=10;

2021-03-12 20:32:33 54

原创 JS笔记_垃圾回收(GC)

程序运行过程中会产生垃圾,这些垃圾积攒过多以后,会导致程序运行的速度变慢。所以我们需要一个垃圾回收的机制,来处理程序运行过程中产生的垃圾。当一个对象没有任何的变量或属性对它进行引用时,我们将永远无法操作该对象,此时这种对象就是垃圾,这种对象过多会占用大量的内存空间,导致程序 运行变慢,所以这种垃圾必须进行清理。在JS中拥有自动的垃圾回收机制,会自动将这些垃圾对象从内存中销毁,我们不需要也不能进行垃圾回收的操作。我们需要做的只是将不再使用的对象设置null即可。...

2021-03-12 20:08:16 63

原创 JS笔记_原型对象

原型prototype我们所创建的每一个函数,解析器都会向函数中添加一个属性prototype,这个属性对应着一个对象,这个对象就是我们所谓的原型对象。如果函数作为普通函数调用prototype没有任何作用,当函数以构造函数的形式调用时,它所创建的对象中都会有一个隐含的属性,指向该构造函数的原型对象,我们可以通过__proto__来访问改属性。原型对象就相当于一个公共的区域,所有同一个类的实例都可以访问到这个原型对象,我们可以将对象中共有的内容,统一设置到原型对象中。当我们访问对象的一个属性或方法时

2021-03-11 19:46:49 69

原创 JS笔记_创建对象的几种方式

使用工厂方法通过该方法可以大批量的创建对象。例:function createPerson(name,age,gender){ var obj=new Object(); obj.name=name; obj.age=age; obj.gender=gender; obj.getName=function(){ console.log(name)

2021-03-11 18:14:40 68

原创 JS笔记_this

解析器在调用函数时每次会向函数内部传进一个隐含的参数,这个隐含的参数就是this,this指向的是一个对象,这个对象我们称为函数执行的上下文对象,根据函数的调用方式的不同,this会指向不同的对象。1.以函数的形式调用时,this永远都是window;2.以方法的形式调用时,this就是调用方法的那个对象。...

2021-03-11 17:13:03 47

原创 JS笔记_作用域

作用域指一个变量作用的范围在JS中一共有两种作用域:1.全局作用域直接编写在script标签中的js代码,都在全局作用域。全局作用域在页面打开时创建,在页面关闭时销毁。在全局作用域中有一个全局对象window,它代表的是一个浏览器的窗口,它由浏览器创建,我们可以直接使用。在全局作用域中,创建的变量都会作为window的属性保存,创建的函数都会作为window的方法保存。全局作用域中的变量都是全局变量,在页面的任意部分都可以访问到。变量提升机制变量的声明提前使用var关键字声明的变量,会在

2021-03-10 22:53:34 116

原创 JS笔记_函数

函数也是一个对象函数中可以封装一些功能(代码),在需要时可以执行这些功能(代码)函数中可以保存一些代码在需要的时候调用使用typeof检查一个函数对象时,会返回function创建一个函数对象实际开发中很少用构造函数创建一个函数对象可以将要封装的代码以字符串的形式传递给构造函数:var fun=new Function(“console.log(‘hello,这是我的第一个函数’);”);封装到函数中的代码不会立即执行,会在函数调用的时候执行语法:函数对象()当调用函数时,函数中的代码会

2021-03-10 14:20:57 141

原创 JS笔记_基本数据类型和引用数据类型

基本数据类型:String Number Boolean Null Undefined引用数据类型:ObjectJS中的变量都是保存到栈内存中的,基本数据类型的值直接在栈内存中存储,值与值之间是独立存在,修改一个变量不会影响到其他变量;例:如下图,a的值为"小明",b=a,然后将b的值改为"小亮",这时候a的值还是"小明",a的值不会受到影响。对象是保存到堆内存中的,每创建一个新的对象,就会在堆内存中开辟出一个新的空间,而变量保存的是对象的内存地址(对象的引用),如果两个变量保存的是同一个

2021-03-10 13:15:39 65

原创 JS笔记_对象

对象的分类1.内建对象由ES标准中定义的对象,在任何的ES的实现中都可以使用;比如:Math String Number Boolean Function Object…2.宿主对象由JS的运行环境提供的对象,目前来讲主要是指由浏览器提供的对象;比如:BOM DOM3.自定义对象由开发人员自己创建的对象对象的基本操作创建对象使用new关键字调用的函数,是构造函数constructor;构造函数是专门用来创建对象的函数;使用typeof检查一个对象时,会返回object;向对象中保

2021-03-10 12:19:36 67

原创 JS笔记_break与continue

break关键字可以用来退出switch或循环语句,break关键字会立即终止离他最近的那个循环语句。continue关键字可以用来跳过当次循环,同样continue也是默认只会对离他最近的循环起作用。不能在if语句中使用break和continue.可以为循环语句创建一个label,来标识当前的循环;语法:label:循环语句使用break语句时,可以在break后面跟一个label,这样break将会结束指定的循环,而不是最近的。例子:outer: for(var i=0;i

2021-03-10 10:54:43 93

原创 JS笔记_流程控制语句

if语句语法一if(条件表达式){语句}语法二if(条件表达式){语句}else{语句}语法三if(条件表达式){语句}else if(条件表达式){语句}else{语句}条件分支语句(switch语句)switch(条件表达式){case 表达式:语句…break;case 表达式:语句…break;default:语句…break;}while循环while(条件表达式){语句…}do{语句…}while(条件表达式)for

2021-03-09 15:38:07 129

原创 JS笔记_条件运算符

条件运算符也叫三元运算符。语法:条件表达式?语句1:语句2;执行的流程:条件运算符在执行时,首先对条件表达式进行求值,如果值为true则执行语句1,并返回执行结果;如果该值为false则执行语句2,并返回执行结果。如果条件表达式的求值结果是一个非布尔值,会将其转换为布尔值后再运算。...

2021-03-09 09:32:16 83

原创 JS笔记_相等运算符

相等相等运算符用来比较两个值是否相等。如果相等会返回true,否则会返回false.使用= =来做相等运算使用==来做相等运算,如果两个值的类型不同,则会自动进行类型转换,将其转换为相同的类型,然后再比较。undefined衍生自null,所以这两个值做相等判断,会返回true。NaN不和任何值相等,包括他本身。可以通过isNaN()函数来判断一个值是否为NaN,如果是则返回true,否则返回false。不相等不相等用来判断两个值是否不相等,如果不相等则返回true,否则返回false。

2021-03-09 09:08:00 87

原创 JS笔记_关系运算符

通过关系运算符可以比较两个值之间的大小关系,如果关系成立它会返回true,如果关系不成立则会返回false。>大于号判断符号左侧的值是否大于符号右侧的值>=大于等于判断符号左侧的值是否大于或等于右侧的值<小于号判断符号左侧的值是否小于右侧的值<=小于等于判断符号左侧的值是否小于或等于右侧的值。任何值和NaN做任何比较都是false比较两个字符串时比较的是字符串的字符编码比较字符编码时是一位一位比较,如果第一位一样则比较下一位,所以借用它来对英文进行排序。比较中

2021-03-09 08:44:54 117

空空如也

空空如也

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

TA关注的人

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