- 博客(38)
- 收藏
- 关注
原创 uniapp离线打包apk - Android Studio
uniapp离线打包apk步骤1、Android 离线SDK 的下载2、下载 Android Studio3、准备安卓签名证书文件4、解压下载的Android离线SDK,找到 HBuilder-Integrate-AS 文件夹,进入 HBuilder-Integrate-AS\simpleDemo\src\main\assets\apps 下,删除apps 文件夹下原有的文件
2023-08-24 14:27:31
1139
原创 uniapp中使用photo-sphere-viewer.js实现全景VR图
uniapp中使用photo-sphere-viewer.js实现全景VR图
2023-02-22 09:37:22
5675
7
原创 在uni-app中使用手机号一键登录
uniapp一键登录:使用DCloud 推出的一键登录产品(univerify ),可使用本机手机号码自动登录。univerify是替代短信验证登录的下一代登录验证方式,能消除现有短信验证模式等待时间长、操作繁琐和容易泄露的痛点。
2022-09-18 17:00:00
14550
11
原创 给elementUI中的 this.$confirm 添加按钮的加载效果
给element-UI的 $confirm 弹窗中的按钮添加 loading 加载效果
2022-05-13 17:43:47
7189
1
原创 Vue导出Excel乱码问题(已解决)
后端已经写好了导出Excel的接口,调用接口会发现后端返回的是二进制流文件实现方法:在封装接口时,给接口传递一个参数【 responseType: 'blob' 】 该参数是处理导出Excel表格数据乱码问题的关键在页面中写实现方法// 订单导出getOrderExport(){ exportOrder(this.query).then(res => { console.log(res); const link = document.createElement...
2022-01-08 15:30:00
4058
原创 Vue动态控制el-date-picker的disabled属性
做项目时有时会有这种需求,在时间选择器中有数据时,它的时间无法修改;时间选择器中不存在数据时,时间可以编辑。这种就需要通过控制<el-date-picker>的disabled属性来实现。效果图:<el-date-picker>选择器代码:
2021-12-04 16:00:00
2688
原创 了解 cookie、session、localStorage、sessionStorage之间的区别
cookie和sessioncookie和session:是用来跟踪浏览器用户身份的会话方式cookie和session的区别1、cookie的数据保存在浏览器上,session的数据保存在服务器2、cookie可以设置失效时间。不设置过期时间,cookie则被保存在内存中,生命周期随浏览器的关闭而结束;设置了过期时间,cookie则被保存在硬盘中,关闭浏览器后,cookie数据仍然存在,直到过期时间结束才消失。session存储在服务器中,关闭浏览器或停止服务器,session被清除。
2021-11-07 14:03:49
1171
原创 原生js操作元素类名(classList,classList.add...)
1、classListclassList属性是一个只读属性,返回元素的类名,作为一个DOMTokenList集合(用于在元素中添加,移除及切换css类)length:返回类列表中类的数量,该属性是只读的<style> .lis { width: 200px; height: 100px; background-color: skyblue; } .box { width: 100px;
2021-10-23 22:26:54
3528
2
原创 ES6中的Map和Set
ES6中的Map和Set1、MapMap对象以键值对的形式存储,它的键和值可以是任何类型Map的创建 // 创建一个空Map let map = new Map(); //用一个二维数组来创建一个非空Map let map2 = new Map([ ["name","李四"], ["age",12], [{},123], [12,8] ]); console.log...
2021-10-16 12:00:00
303
原创 js判断是否是数组的方式
1、通过Object.prototype.toString.call()判断用的是Object中的toString方法,数组中的toString方法用于字符串的拼接var arr = [1,2];//通过原型链查找调用//结果为true 是数组console.log(Object.prototype.toString.call(arr)=== '[object Array]');//trueconsole.log(arr.toString());//1,22、Array.isAr
2021-10-13 15:20:37
3860
原创 JS案例--旋转木马轮播
效果:每张图片排列的位置是以中间为对称的。图片大小,透明度不相同,但对称的图片的样式是相同的,呈现出一种立体的轮播效果。轮播动态效果图:先看看代码:<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>旋转木马轮播图</title> <link rel="stylesheet" href="css..
2021-10-10 13:47:11
668
原创 js中的防抖和节流
概念:函数防抖(debounce):在持续触发事件的情况下,事件只执行一次函数节流(throttle):在持续触发事件时,每隔一段时间执行一次防抖和节流的最终目的都是避免回调函数中的处理每次都执行,以免出现延迟或卡顿的现象。函数防抖(debounce)//防抖function debounce(fn, wait) { // 存放定时器的返回值 var timeout = null; return function() ...
2021-10-01 16:48:28
138
原创 js数组对象去重的五种方式
数组对象:var str = [ {name: "张三",id: 1}, {name: "李四",id: 2}, {name: "王五",id: 3}, {name: "小明",id: 2}, {name: "小红",id: 1}, ];1、双层for循环for(var i=0;i<str.length - 1;i++){ for(var j = i+1;j<str.length;j++){ if(str[i].id == str[j]
2021-09-25 17:36:06
13063
原创 js中数组排序常用的方法
目录1、Sort排序2、冒泡排序3、选择排序4、插入排序1、Sort排序排序描述:能够根据提供的排序规则,对数组元素进行排序var arr = [9,88,67,24,39,74,28];//sortfunction fun(a,b){ return a-b;//从小到大 //从大到小 b-a}console.log(arr.sort(fun));//[9, 24, 28, 39, 67, 74, 88]2、冒泡排序工作原理:将数组中的相邻两个
2021-09-19 23:44:50
1127
原创 CSS水平垂直居中的方法
第一种:绝对定位,在不确定div的宽高的情况下,使用transform:translate(-50%,-50%);translate(x,y),第一个值表示x轴上的移动,第二个值表示y轴上的移动。取正值表示向右和向下移动;取负值表示向左和向上移动。<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style>..
2021-09-12 10:21:56
196
原创 web前端面试题(含答案)
一、填空题1、JS中的数据类型有哪些 Number,Null,undefined,String,boolean,Array,Function,Object;(8种)2、JS中强制类型转换为 number 类型的方法有:Number() parseInt() parseFloat()3、创建一个子节点 createElement ,插入一个子节点 appendChild ,在已有元素之前插入节点insertsBefore,删除子节点 removeChild 。4、获取元素的第...
2021-09-08 08:02:50
2323
原创 Vue的component组件
定义:组件是可复用的Vue实例,且带有一个名字组件的特点:1、组件体现封装思想(html/css/js) 2、组件是特殊的Vue实例 2.1 组件可以使用Vue选项( 没有el ) 2.2 有自己的选项 template(要求有一个根元素) 3、组件中的data要求必须是一个...
2021-09-06 16:29:18
5995
1
原创 Vue中修改element.style的样式
最近在写一个项目,发现项目右侧有滚动条,然后在控制台发现element.style,但是在文件中却找不到查资料后知道用可以用 !important来增加它的权重
2021-08-19 15:18:13
743
原创 Vue中计算属性和methods方法的区别
1、计算属性和methods的执行结果都是相同的2、当计算属性没有依赖data中的数据时,第一次使用计算属性时,会把第一次的结果进行缓存,后面再次使用计算属性,都会去第一次的结果中进行查找3、methods方法,每调用一次,就会触发一次4、计算属性的用法与data中的数据用法一样,因此计算属性在使用时,不加()5、methods方法在调用时,()可加可不加6、计算属性具有缓存功能,methods方法没有<div id="app"> <p>m.
2021-08-13 08:38:09
3674
1
原创 js实现鼠标移入移出卡片切换内容
案例动态效果图:html代码:<div class="sports-purple"> <div class="all"> <!-- 内容 --> <div class="content"> <!-- 第一块内容 --> <div class="first-block"> <!-- 内容的侧边栏 --> <div .
2021-07-29 10:32:28
779
原创 Vue中v-model的实现原理
v-model用于表单数据的双向绑定,其实它的本质就是一个语法糖(简化写法),它的实现原理是: 1.v-bind绑定一个value属性 2.v-on指令给当前元素绑定input事件写个小案例:<div id="app"> <!-- v-model 是简化写法(语法糖) 特点:双向数据绑定 --> {{msg}} <input type...
2021-07-28 08:23:09
893
原创 js Date方法(下)
1、setDate() 方法根据本地时间来设置一个月的某一天。语法:Date.setDate(day);数值为1-31;0表示上个月的最后一天-1表示上个月最后一天的前一天如果当月是31天:32是下个月的第一天;如果当月是30天:32则是下个月的第二天例子:var day = new Date('May 19,1975 12:12:30');day.setDate(21);console.log(day.getDate());//21var days = new Date(2020
2021-06-27 10:24:38
275
原创 js Date方法(上)
1.indexOf():查找一个字符串在另一个字符串的位置(在已知的字符串中,查找目标字符串第一次出现的下标,没有找到返回-1)语法:str.indexOf(目标字符串,fromIndex);注意:第一个参数是必要参数,第二个参数是可选参数。如果不写默认从下标为0开始查找var str = 'abcde';var index = str.indexOf('bc',0);console.log(index);//12.lastIndexOf():在已知的字符串中,查找【目标字符串】[最
2021-06-20 17:04:41
204
原创 js 数组方法
1、isArray()描述:用来判断一个变量是否是数组。如果是返回true,否则返回false语法:Array.isArray(数组变量)注意:本方法不由数组变量调用,而是必须由Array调用var arr = [1,2,3,4,5];console.log(Array.isArray(arr));//truevar obj = {};console.log(Array.isArray(obj));//false2、toString()方法描述:能够将数组中的数组元素,拼接成以逗号隔开
2021-06-08 12:35:31
99
原创 js字符串方法
1.indexOf():查找一个字符串在另一个字符串的位置(在已知的字符串中,查找目标字符串第一次出现的下标,没有找到返回-1)语法:str.indexOf(目标字符串,fromIndex);注意:第一个参数是必要参数,第二个参数是可选参数。如果不写默认从下标为0开始查找var str = 'abcde';var index = str.indexOf('bc',0);console.log(index);2.lastIndexOf():在已知的字符串中,查找【目标字符串】[最后一次
2021-06-03 16:56:24
65
原创 JS实现省市区三级联动
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>三级联动</title> <style> select{ width: 150px; height: 30px; } </style></head>
2021-05-30 20:30:55
731
原创 js 数据类型的检测、转换
typeof 操作符返回一个字符串,表示未经计算的村支书的类型(检测变量的数据类型)<script> //String console.log(typeof "1"); console.log(typeof (typeof 1)); console.log(typeof String(1));//String将任意值转换为字符串 // 数值 number console.log(typeof NaN); console.log(ty
2021-05-27 14:48:45
162
原创 js 获取元素的方式
js 获取元素5种的方式1、标签获取元素getElementsByTagName()方法返回一个动态的包含所有指定标签名的元素的集合。语法: document.getElementsByTagName(‘元素的标签名’);<body><p id="demo">Hello World!</p><p id="pro">Hi Jhon!</p></body><script> //根据标签改变字...
2021-05-20 19:51:11
18732
原创 css3动画之太极图
css3动画之太极图<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> body{ background-color: darkgray; } .circle{ width: 0px; height: 500px; margin: 100px
2021-05-12 19:42:21
391
1
原创 JS adoptNode()方法
1、adoptNode(Node)方法用于从另外一个文档中获取一个节点(可以是任何节点类型)adoptNode()会将原文档中的节点删除iframe.html 代码:<body> <h1 id="h1">Hello World!!</h1> <h3 id="h3">获取节点</h3> <h2 id="h2">HTML/CSS</h2> <h2 id="h">JavaSc
2021-05-12 19:31:27
433
原创 JS activeElement()方法
document.activeElement属性返回文档中当前获得焦点的元素(该属性是只读的)例:<body><input type="text" value="输入字段"><button>按钮</button></body>
2021-05-12 19:00:59
2065
原创 JS addEventListener()方法
addEventListener(),事件监听,用于向指定的元素添加事件监听例: <button id="btn">点击</button> <script> document.getElementById("btn").addEventListener("click",function () { console.log(Date()); }); <
2021-05-11 12:51:08
24168
原创 JS函数的4种调用方式
函数可以声明定义,也可以是一个表达式,函数使用关键字function定义函数被定义时,函数内部的代码不会执行函数被调用时,函数内部的代码才会执行函数有四种调用方式,每种方式的不同在于this的初始化。(this是保留关键字,this指函数执行时的当前对象,this的值无法改变)1、作为一个函数调用:直接调用函数function abc(x,y) { return x * y; }; // console.log(abc(5,6)); console.lo
2021-05-07 20:46:43
13066
1
原创 JavaScript变量和数据类型
变量是用于存储信息的“容器”变量命名规则: 1)必须以字母开头,中间可以是数字、字母或下划线; 2)也能以$和_符号开头 3)严格区分大小写 4)不能使用js中的关键字作为变量名,如int,new...所有的js变量都由关键字var声明。声明变量:先声明变量,再赋值: var name; name="str";在声明变量的同时进行赋值:var name = "str";也可以在一条语句中声明多条变量(用逗号隔开): var name = "d
2021-05-06 21:00:48
86
原创 css制作彩虹以及鼠标移入的效果
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <style> .box{ width: 100px; height: 100px; background-color: white; position: relative; } .box_containe
2021-05-06 19:01:50
259
原创 js制作动态时钟
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <style> *{ margin: 0; padding: 0; } ul{ list-style: none; } .clock{ width: 300px; height:
2021-05-06 18:11:55
112
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人