- 博客(42)
- 收藏
- 关注
RSS订阅原创 解决uniapp中的swiper中只有一项swiper-item时自动轮播会失效
做了一个h5的项目 是用uniapp写的其中有一个轮播的功能 发现有的时候自动轮播会失效 后来发现当后台只有一项数据时 动态渲染则swiper-item也只会出现一条 那么这样 则不会自动轮播 用了官网的实例 <swiper class="swiper" :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval" :duration="duration">
2021-12-06 10:18:03
3641
1
原创 微信小程序分页（超简单）
之前写过一个项目主要是tab切换后的列表的一个分页（用的是uniapp），现在用的是微信原生的，没有切换，纯粹的一个分页的功能页面的初始数据data：{ list：[ ], pagesize:10,//每页展示的条数 curpage: 1,//当前页数 count:1//总页数}1. 这里是一个方法(getList)，调用接口 一般都需要 当前页数和每页展示的条数 所以调接口传参 { pagesize: this.data.pagesize,
2021-06-28 09:30:33
11202
3
原创 set map和WeakSet 集合
Set集合Set 原本就是一个构造函数，Set 集合主要用于存储不重复的数据，简单来说就是数据的去重Set 函数可接受一个数组（或具有 iterable 接口的其他数据结构）作为参数，用来初始化//类数组对象作为参数const s = new Set(document.getElementsByTagName('div'));s.size;Set与扩展运算符（…）实现数组去重//Set实现简单的数组去重const s = new Set([2, 4, 5, 2, 5, 3, 1]); //
2020-09-01 19:45:55
149
原创 vue的生命周期钩子函数的作用
之前在大学学习Java的时候 笔试题的第一道题经常是你是怎么理解生命周期的 在vue的生命周期却又与Java不同的 一个java类的完整的生命周期会经历加载、连接、初始化、使用、和卸载五个阶段；而vue的生命周期则是4个 下面这张图应该都很熟悉 就是vue官网的图 先看看官网是怎么说的:每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如，需要设置数据监听、编译模板、将实例挂载到 DOM 并在数据变化时更新 DOM 等。同时在这个过程中也会运行一些叫做生命周期钩子的函数，这给了用户在不同
2020-08-31 21:24:13
2009
原创 webpack超详细教程
这是一篇非常用心的博客了 午休没睡 应该再不会有看不懂的吧 相信有人和我一样 如果刚开始学习webpack会一头雾水 不知道如何开始 今天就详细的记录一下webpack的具体步骤以及需要注意点 老规矩 有错误的欢迎指正什么是webpack以及他的的作用是什么 我觉得这一篇文章说的是比较好懂的一个什么是 webpack 以及 其作用?总的来说就是一个模块打包工具首先，认为它是一个工具，帮助我们更好的处理事情的。其次，“打包”，如何理解？ 假设我们需要寄快递。我们将许多的物品都放进了一个纸
2020-08-25 19:42:27
448
原创 前端基础面试题分享
这篇博客是我在复习时回顾的一些问题 答案在我认为可以说是比较完整的答案了 所以会整理的比较慢 虽然对于大佬们来说都是一些基础题 这个将会持续更新随时补充 毕竟学无止境嘛 如果有不对的 我也欢迎指正呀apply，call和bind的使用及区别1）apply，call和bind都是 用来改变this的指向，用于改变上下文的指向2）apply和call会让当前函数立即执行，而bind会返回一个函数，后续需要的时候再调用执行3)call其实是apply的一个语法糖，他们的作用都是用于改变上下文的指
2020-08-24 16:00:22
3733
原创 git的基本操作及指令详解
在工作中 常用到git 今天来回顾一下git是什么以及它的基本操作一.什么是版本管理项目在迭代更新的过程中，会产生很多个版本，有时可能需要回到之前的某个版本中，如果单纯用备份的做法来做，在版本多的情况下会非常麻烦且凌乱，为此，我们需要借助专业的工具来帮我们进行版本的管理。而Git就是其中的版本管理工具之一。二.版本控制工具介绍以下是比较主流的版本控制工具。CVS：老牌的版本控制工具，主要在开源软件管理中使用。多个开发人员通过一个中心版本控制系统来记录文件版 本，从而达到保证文件同步的目的。（诞
2020-08-21 15:13:33
186
原创 vue中的To-Do 应用详解
在刚看到vue这个todo的案例时 看了源码发现不是很懂 写完之后也依旧有点乱 本人逻辑不太行 就开始一步步的推了一下 每一步的作用也全都注释出来了 再去写就好多了 希望这个博客帮助和我之前一样不太能理解的人 有不对的也欢迎指正<html><head> <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> <title></title>
2020-08-19 10:48:49
1268
原创 vue指令用法简单讲解
vue指令1.v-text更新元素的文本内容。也可以使用 {{msg}} 插值。转义输出 <span v-text="msg"></span> <span>{{msg}}</span>2.v-html更新元素的文本内容。不转义输出<span v-html="msg"></span>3.v-show“v-show的用法与v-if基本一致，只不过v-show是改变元素的CSS属性display。当v-show表达式的值
2020-08-18 23:37:51
264
原创 区分splice()、slice()、split()函数
突然听到关于这个的面试题 虽然也知道一些 但是大概一分钟都苟不住的那种 还是不是很清楚 所以重新复习一下
2020-08-11 23:54:19
978
原创 实现图片懒加载的两种方法
懒加载及应用场景懒加载是一种对网页性能优化的方式，比如当访问一个页面的时候，优先显示可视区域的图片而不一次性加载所有图片，当需要显示时，再发送图片请求，避免打开网页时加载过多资源。当一个网站的加载图片过多时就需要懒加载的协助，页面图片多时，在首次载入时一次性加载会耗费时间长，使用懒加载可以使页面加载速度快、减轻服务器的压力、节省流量。实现的思路：：给目标元素指定一张占位图，将真实的图片链接存储在自定义属性中（data-），监听scroll事件，当图片出现在可视区时，将data-src值赋值给src
2020-08-11 18:16:43
4281
原创 MongoDB常用知识学习
一.数据库的分类数据库主要分为两类： 1.关系型数据库(RDBMS) Mysql、Oracle、DB2、SQL Server 关系型数据库全是表 2..非关系型数据库(NoSql) MongoDB、redis 键值对数据库 文档数据库MongoDB二.MongoDB简介MongoDB是为快速开发互联网Web应用而设计的数据库系统MongoDB的设计目标是极简、灵活、作为Web应用栈的一部分MongoDB的数据模型是面向文档的，所谓文档是一种类似于JSON的结构，可以简单为
2020-08-01 16:15:39
322
3
原创 mysql数据库介绍及其基本用法
一.什么是数据库数据库（Database）是按照数据结构来组织、存储和管理数据的仓库。每个数据库都有一个或多个不同的 API用于创建，访问，管理，搜索和复制所保存的数据。我们使用关系型数据库管理系（RDBMS）来存储和管理大数据量。关系型数据库是建立在关系模型基础上的数据库，借助于集合代数等数学概念和方法来处理数据库中的数据。二.RDBMS1.RDBMS即关系数据库管理系统的特点： ①数据以表格的形式出现 ②每行为各种记录名称 ③每列为记录名称所对应的数据域 ④许多的行和列组成一张表单
2020-07-28 20:29:54
230
原创 学习node总结（开始）
什么是node.js?Node.js 就是运行在服务端的 JavaScript,是一个基于Chrome JavaScript 运行时建立的一个平台。(基于Google的V8引擎，V8引擎执行Javascript的速度非常快，性能非常好。)关于Node.js 安装配置可以参考https://www.runoob.com/nodejs/nodejs-install-setup.htmlNode.js 应用是由哪几部分组成的1.引入 required 模块：我们可以使用 require 指令来载入 No
2020-07-27 22:01:53
141
原创 记录让页面元素垂直水平居中的几种方式
实现页面(元素)居中（水平 垂直居中）的效果有很多种 我这里列举了几种最终的效果图都是：图标就是我们元素1.使用定位 在下面案例中 核心代码就是 ：(这种是已经知道元素的（此处的元素就是img）宽高)position: absolute;top:50%;left: 50%;margin-left: -50px;//用来减去img宽度的一半margin-top: -50px;//用来减去img高度的一半style type="text/css"> .big{ width: 20
2020-07-21 18:33:30
241
原创 js面向对象的三大特性
封装：低耦合高内聚多态：重载和重写重载：方法名相同，形参个数或类型不一样(js中不存在真正意义上的重载，js中的重载指的是同一个方法，根据传参不同，实现出不同的效果)eg：function sum(x,y,z){// argumentsif(typeof z === “undefined”){return;}}sum(1,2);sum(1,2,3)重写：在类的继承中，子类可以重写父类的中的方法继承:什么是面向对象面向对象是一种编程思想 js本身就是基于面向对象构建出来的，而j
2020-07-20 20:26:32
2107
原创 es6 对象新增的api
es6 对象新增的api一.Object.is():在用法上和严格相等（===）大多数情况下一样，但对于NaN、0、-0、+0的判断不一样console.log(1 === 1); //trueconsole.log(Object.is(1,1));//trueconsole.log(-0 === +0); //trueconsole.log(Object.is(-0,+0));//falseconsole.log(NaN === Nan); //falseconsole.log(Obje
2020-07-12 16:15:36
427
原创 es6解构总结一
解构赋值：允许你使用类似数组或对象字面量的语法将数组和对象的属性赋给各种变量。优点：简化书写的长度，提升效率数组解构：1、左边还可以用连续逗号的方式跳过右侧对应的值。2、嵌套赋值3、与剩余运算符连用4、当解构赋值为空，或过界时，返回undefined5、解构赋值时，可以设置默认值，但默认值只有在undefined时起作用对象解构：1、可以通过声明与对象属性值相同名称的变量来获取对象的属性值例：let {a}={a:4};2、可嵌套（可与数组嵌套）3、当解构赋值为空，或过界时，
2020-07-08 18:57:39
264
原创 ajax知识详细讲解
1、ajax是什么?ajax: asynchronous javascript and xmlajax是一种用来改善用户体验的技术，其本质是利用浏览器内置的一种特殊的对象(XMLHttpRequest)异步(即发送请求时，浏览器不会销毁当前页面，用户可以继续在当前页面做其它的操作)的向服务器发送请求,并且利用服务器返回的数据(不再是一个完整的页面，只是部分的数据，一般使用文本或者xml返回)来部分更新当前页面。使用ajax技术之后，页面无刷新，并且不打断用户的操作。2、ajax对象(1)如何获得a
2020-07-08 13:04:16
248
原创 jquery学习总结（二）
jQuery 操作类：addClass() - 向被选元素添加一个或多个类removeClass() - 从被选元素删除一个或多个类toggleClass() - 对被选元素进行添加/删除类的切换操作hasClass() - 检查被选元素是否包含指定的类名称。如果被选元素包含指定的类，该方法返回 “true”。jQuery 效果- 隐藏和显示show() 方法显示隐藏的被选元素。注意：show() 适用于通过 jQuery 方法和 CSS 中 display:none 隐藏的元素（不适用于通
2020-05-17 18:40:48
200
原创 jquery的学习总结（一）
jquery介绍：jQuery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（或JavaScript框架）。jQuery设计的宗旨是“write Less，Do More”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作、事件处理、动画设计和Ajax交互。jQuery的核心特性可以总结为：具有独特的链式语法和短小清晰的多功能接口；具有高效灵活的css
2020-05-17 17:28:42
602
原创 十分钟全面了解es6及其发展历史
1.简介什么是ES6：ES6是ECMA Script 6.0的简称, 就是语言最新的标准, 发布与15年左右目标让js语言成为能支持去编写大型复杂的应用语言, 成为企业级开发语言javascript和ECMA Script区别?javascript, Java特别火,导致名字一直是javascriptECMA组织制定js标准,不想用java, 叫ECMA Script 6.02.变量...
2020-03-22 15:23:22
1099
原创 css3制作3d正方体相册
写了一个3D旋转相册 外面是一个正方体 内部是一个小的正方体 当然 鼠标不到外面的大的正方体是看不见里面小的正方体的 图片我用的是img引入的 也可以换成背景图引入 下面的代码其实还可以做一些简化 并且也有其他的更好的方法 哈哈哈 不过自己本人太懒了 就这个样子叭~<!DOCTYPE html><html lang="en"><head> ...
2020-01-05 21:10:20
1236
原创 CSS3弹性盒子详解（子项相关）
在学习CSS3 弹性盒子(Flex Box)之前，我们先了解：CSS盒模型本质上是一个盒子，封装周围的HTML元素，它包括：边距，边框，填充，和实际内容。w3c标准盒模型以宽度举例（高度是同理的）boxWidth = 设置的宽( width ) + 边框的两边 ( border * 2 ) + 内边距两边（padding * 2）IE6混杂模式 （怪异模式）box-sizing: b...
2019-12-28 17:05:46
993
原创 canvas简单介绍
1.1什么是canvas？①：canvas是HTML5提供的一种新标签②：HTML5 标签元素用于图形的绘制，通过脚本 (通常是JavaScript)来完成。③：标签只是图形容器，必须使用脚本来绘制图形。Canvas是一个矩形区域的画布，可以用JavaScript在上面绘画。控制其每一个像素1.在Canvas上画线，我们将使用以下两种方法：moveTo(x,y) 定义线条开始坐标li...
2019-12-27 10:37:38
605
原创 canvas绘制飞机大战
最开始我们要初始化信息：我们有五个状态第一阶段：游戏欢迎状态 0 START第二阶段：游戏加载状态 1 LOADING第三阶段：游戏运行状态 2 RUNNING第四阶段：游戏暂停阶段 3 PAUSE第五阶段：游戏结束阶段 4 GAMEOVER 飞机大战HTML5canvas版 <script type="tex...
2019-12-27 10:06:38
646
1
原创 去重详解
先说一下 == 和 === 区别=== 严格相等，会比较两个值的类型和值== 抽象相等，比较时，会先进行类型转换，然后再比较值一、利用for嵌套for，然后splice去重（ES5中最常用）用双重for循环把前一个和所有后面的元素进行比较，如果相等则删除 缺点：如果数组长度很大，效率会很低这个方法需要注意要j–否则如果数组里面有三个及以上连续相等的元素的时候，就会出现问题。例如：var...
2019-12-26 21:11:14
523
原创 CSS3 选择器总结及详解
CSS3 选择器在 CSS 中，选择器是一种模式，用于选择需要添加样式的元素。兄弟选择符： ~<style> *{ margin: 0; padding: 0; } body{ text-align: center; } h3{ background: yellow; width: 150px; height: 40px; line-hei...
2019-12-26 17:52:07
573
原创 五星好评的三种方法（原生js）
先展示js代码/*//01// 获取节点var starCollection = document.getElementsByClassName('star-item');//每个元素都要有点击事件，需要循环for (var i = 0; i <starCollection.length; i++){ starCollection[i].setAttribute('data...
2019-12-15 22:49:01
1464
原创 HTML BOM（下）
Window Screenwindow.screen 对象不带 window 前缀也可以写：screen 对象包含用户屏幕的信息。属性：screen.width：属性返回以像素计的访问者屏幕宽度<p id="demo"></p><script>document.getElementById("demo").innerHTML = "屏幕宽度是："...
2019-12-09 20:02:34
300
原创 HTML BOM上(主要是window对象的总结)
Window 对象所有浏览器都支持 window 对象。它表示浏览器窗口。所有 JavaScript 全局对象、函数以及变量均自动成为 window 对象的成员。全局变量是 window 对象的属性。全局函数是 window 对象的方法。甚至 HTML DOM 的 document 也是 window 对象的属性之一window对象的属性:window.innerHeight属性：返...
2019-12-09 17:06:11
180
原创 对象的五种创建模式
对象的五种创建模式方式一:Object构造函数模式 套路:先创建空Object对象,再动态添加属性/方法 适用场景:起始时不确定对象内部数据 **缺点:语句太多** 例子: var p = new Object() p.name = 'zhangsan' p.age = 18 p.setName = function(name)...
2019-12-01 20:58:27
341
原创 类数组和数组转换
看到数组和类数组我们首先要思考几个问题。在这里写出了我的想法1、数组和类数组对象有什么区别？数组定义：简而言之就是一组有序的数据集合，其索引为从0开始且自然增长的整数，其元素值可以是任何js数据！并且包含一个名为length的属性，该属性表示数组元素的个数！类数组对象：1)它拥有length属性，其它属性（索引）为非负整数（对象中的索引会被当做字符串来处理）；2)最主要的区别：类数组对象不...
2019-11-29 17:22:53
362
原创 DOM（上）
DOM 【document object model】文档对象模型当网页被加载时，浏览器会创建页面的文档对象模型（Document Object Model。objectjs不能直接操作网页节点(html元素)js只能操作js数据类型 【string array object function boolean undefined …】最容易 最直接 最直观 描述 我们的html元素的只有...
2019-11-24 23:09:45
200
原创 js写2048小游戏
首先页面布局<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <link rel="stylesheet" href="demo1.css"></head><bo...
2019-11-23 16:15:26
422
原创 10分钟简单理解闭包
1.闭包是什么?闭包是指有权访问另一个函数作用域中的变量的函数。理解这个之前首先要了解:1.变量的生命周期全局变量的作用域是全局性的，即在整个JavaScript程序中，全局变量处处都在。（JavaScript中的方法内部定义变量的时候如果没有加var，就是全局变量；否则为局部变量；）而在函数内部声明的变量，只在函数内部起作用。这些变量是局部变量。局部作用域(函数作用域)，他只在函数内部...
2019-11-12 21:27:17
326
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人