- 博客(39)
- 收藏
- 关注
RSS订阅原创 window.load和$(document).ready()区别
1.执行时间window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行。$(document).ready()是DOM结构绘制完毕后就执行，不必等到加载完毕。2.编写个数不同window.onload不能同时编写多个，如果有多个window.onload方法，只会执行一个$(document).ready()可以同时编写多个，并且都可以得到执行以下代码无法正确执行：window.onload = function(){alert(“text1”);};window.on
2022-03-15 09:23:52
754
原创 浅谈CSS3中display属性的Flex布局
最近在学习微信小程序，在设计首页布局的时候，新认识了一种布局方式display:flex1 .container {2 display: flex;3 flex-direction: column;4 align-items: center;5 background-color: #b3d4db;6 }**Flex是Flexible Box的缩写，意为"弹性布局"，用来为盒状模型提供最大的灵活性。**设为Flex布局以后，子元素的float、clear和vertical-al
2022-03-15 09:22:20
311
原创 浅析webpack的原理
一、前言 现在随着前端开发的复杂度和规模越来越大，鹰不能抛开工程化来独立开发，比如：react的jsx代码必须编译后才能在浏览器中使用，比如sass和less代码浏览器是不支持的。如果摒弃这些开发框架，开发效率会大幅下降。在众多前端工程化工具中，webpack脱颖而出成为了当今最流行的前端构建工具。二、webpack的原理知其然知其所以然。1、核心概念（1）entry：一个可执行模块或者库的入口。（2）chunk：多个文件组成一个代码块。可以将可执行的模块和他所依赖的模块组合成一
2022-03-15 09:20:08
8682
6
原创 2022前端面试热门题
DOM结构 —— 两个节点之间可能存在哪些关系以及如何在节点之间任意移动。两个节点之间可能存在哪些关系？——DOM中两个节点存在的关系无非3种：父子 同辈 包含 1.1.包含与被包含,IE率先引入的contains()方法可检测，例 A.contains(B)， 即检查节点B是否是节点A的子节点，返回布尔值，现大多数浏览器都支持； DOM level 3引入的compareDocumentPosition()，确定节点之间的关系， 返..
2022-02-24 17:31:59
154
原创 vue .sync修饰符
日常开发时，我们总会遇到需要父子组件双向绑定的问题，但是考虑到组件的可维护性，vue中是不允许子组件改变父组件传的props值的。那么同时，vue中也提供了一种解决方案.sync修饰符。首先我们知道，父组件通过绑定属性的方式向子组件传值，而在子组件中可以通过$emit向父组件通信，通过这种间接的方式改变父组件的data，从而实现子组件改变props的值。比如向下边这这样：子组件使用$emit向父组件发送事件：this.$emit('update:title', newTitle)父组件监听这个事件
2021-11-22 16:11:48
1001
原创 BFC--块格式化上下文
BFC是什么？BFC（Block Formatting Context，块格式化上下文） 是Web页面的可视化CSS渲染的一部分，是块盒子的布局过程发生的区域，也是浮动元素与其他元素交互的区域。具有 BFC 特性的元素可以看作是隔离了的独立容器，容器里面的元素不会在布局上影响到外面的元素，并且 BFC 具有普通容器所没有的一些特性。通俗一点来讲，可以把 BFC 理解为一个封闭的大箱子，箱子内部的元素无论如何翻江倒海，都不会影响到外部。BFC 特性(功能)使 BFC 内部浮动元素不会到处乱跑；
2021-11-22 16:09:01
331
原创 前端面试应知应会
DOM结构 —— 两个节点之间可能存在哪些关系以及如何在节点之间任意移动。两个节点之间可能存在哪些关系？——DOM中两个节点存在的关系无非3种：父子 同辈 包含 1.1.包含与被包含,IE率先引入的contains()方法可检测，例 A.contains(B)， 即检查节点B是否是节点A的子节点，返回布尔值，现大多数浏览器都支持； DOM level 3引入的compareDocumentPosition()，确定节点之间的关系， 返..
2021-11-22 16:05:11
601
原创 Docker介绍与部署vue
Docker介绍Docker 是一个开源的应用容器引擎，基于 Go 语言 并遵从 Apache2.0 协议开源。Docker 可以让开发者打包他们的应用以及依赖包到一个轻量级、可移植的容器中，然后发布到任何流行的 Linux 机器上，也可以实现虚拟化。容器是完全使用沙箱机制，相互之间不会有任何接口（类似 iPhone 的 app）,更重要的是容器性能开销极低。Docker 安装参考https://www.runoob.com/docker/windows-docker-install.html/h
2021-04-01 21:38:49
201
原创 Js 实现 二叉树遍历
Js 实现 二叉树定义二叉树二叉树中，相对较小的值保存在左节点上，较大的值保存在右节点中 /*用来生成一个节点*/ function TreeNode(val, left, right) { this.val = (val===undefined ? 0 : val) this.left = (left===undefined ? null : left) this.right = (right===undefined ? null : right) }/*
2021-03-15 14:53:26
808
转载 localStorage和sessionStorage的区别
localStorage和sessionStorage都是window对象提供的全局属性，用途都是在浏览器中存储key/value对的数据。从使用的角度来看，两者的唯一区别在于时效性。sessionStorage在关闭窗口或标签页之后将会删除这些数据。而localStorage则没有这样的特性，今天、下周、明年、一百年，甚至理论上的成千上万年后都能用，除非你手动去删除。如果你想在浏览器窗口关闭后还保留数据，请使用localStorage。如果你是想用于临时保存同一窗口（或标签页）的数据，请使用se
2020-06-19 09:19:25
773
原创 VUE中的mixins 大致用法
vue中提供了一种混合机制–mixins，用来更高效的实现组件内容的复用。最开始我一度认为这个和组件好像没啥区别。。后来发现错了。下面我们来看看mixins和普通情况下引入组件有什么区别？ 组件在引用之后相当于在父组件内开辟了一块单独的空间，来根据父组件props过来的值进行相应的操作，单本质上两者还是泾渭分明，相对独立。 而mixins则是在引入组件之后，则是将组件内部的内容如data等方法、method等属性与父组件相应内容进行合并。相当于在引入后，父组件的各种属性方法都被扩充了。 单纯组件引
2020-05-22 13:57:44
312
转载 js字符串方法
str.charAt(); // 返回特定位置的字符str.charCodeAt(); // 返回表示给定索引的字符的Unicode的值str.codePointAt()(); // 返回使用UTF-16编码的给定位置的值的非负整数str.concat(); // 连接两个字符串文本，并返回一个新的字符串str.includes(); // 判断一个字符串里是否包含其他字符串str.endsWith(); // 判断一个字符串的是否以给定字符串结尾，结果返回布尔值str.indexOf(); /
2020-05-22 13:45:12
177
原创 sql中like的所有用法
在sql结构化查询语言中，like语句有着至关重要的作用。like语句的语法格式是：select * from 表名 where 字段名 like 对应值（子串），它主要是针对字符型字段的，它的作用是在一个字符型字段列中检索包含对应子串的。A：% 包含零个或多个字符的任意字符串：1、like’Mc%’ 将搜索以字母 Mc 开头的所有字符串（如 McBadden）。2、like’%inger’ 将搜索以字母 inger 结尾的所有字符串（如 Ringer、Stringer）。3、like’%en%
2020-05-21 15:41:41
39666
转载 Object.assign()拷贝
Object.assign()拷贝 是浅拷贝还是深拷贝当对象中只有一级属性，没有二级属性的时候，此方法为深拷贝，但是对象中有对象的时候，此方法，在二级属性以后就是浅拷贝。如何实现深拷贝JSON.stringify 和 JSON.parse用 JSON.stringify 把对象转换成字符串，再用 JSON.parse 把字符串转换成新的对象。可以转成 JSON 格式的对象才能使用这...
2020-02-02 21:47:09
407
转载 es6常用函数
一、forEach回调函数参数，item(数组元素)、index(序列)、arr(数组本身)循环数组，无返回值，不改变原数组不支持return操作输出，return只用于控制循环是否跳出当前循环二、includes判断数组是否包含某个元素，不用return，不用回调函数，返回布尔值三、filter使用return操作输出，会循环数组每一项，并在回调函数中操作返回满足条件的元素组成的...
2020-02-02 21:34:59
1813
转载 JavaScript中with语句
简要说明with 语句可以方便地用来引用某个特定对象中已有的属性，但是不能用来给对象添加属性。要给对象创建新的属性，必须明确地引用该对象。语法格式with(object instance) { //代码块 }什么时候使用多次需要使用某对象的属性或方法，照以前的写法，都是通过: 对象.属性或者对象.方法 这样的方式来分别获得该对象的属性和方法，着实有点麻烦，这时...
2020-02-02 21:21:35
201
原创 express跨域cors
在express中写测试接口的时候，经常要考虑跨域，express有一个npm模块，使用起来非常方便cors。安装npm i cors -D引入const express = require('express');const cors = require('cors');const app = express();app.use(cors());...
2020-02-02 21:11:46
195
原创 express框架基础
Express 是一个保持最小规模的灵活的 Node.js Web 应用程序开发框架，为 Web 和移动应用程序提供一组强大的功能。官网链接安装在 目录下安装 Express 并将其保存到依赖列表中。如下：$ npm install express --save使用目标文件 app.jsvar express = require('express') //引包app.get('/...
2020-02-02 21:08:33
252
原创 Vue组件选项props
前言组件接受的选项大部分与Vue实例一样，而选项props是组件中非常重要的一个选项。在 Vue 中，父子组件的关系可以总结为 props down, events up。父组件通过 props 向下传递数据给子组件，子组件通过 events 给父组件发送消息。本文将详细介绍Vue组件选项props...
2019-12-22 21:33:32
88
原创 cookie 和 session
cookie简单介绍http是无状态的。比如访问淘宝首页并登录账号后，当再打开淘宝其他页面时，因为每一次的访问都是独立的，服务器并不知道你已经登录，所以还是不能下单或者加购物车之类的操作。cookie是当第一次访问服务器的时候，服务器在下行HTTP报文时给浏览器分配一个具有特殊标识的字段，此后当浏览器再次访问同一域名的，将该字段t通过请求头携带到服务器。第一次访问服务器是不可能携带cookie...
2019-12-22 21:31:51
101
原创 params传参和query传参
params传参：this.$router.push({ name:"detail", params:{ name:'张三', code:1001 }})query传参：this.$router.push({path:"/detail",query:{name:'张三',code:001}});区别（1）、用法上的query要用path来...
2019-12-16 09:37:34
538
转载 Linux命令
Linux常用命令大全（非常全！！！）最近都在和Linux打交道，感觉还不错。我觉得Linux相比windows比较麻烦的就是很多东西都要用命令来控制，当然，这也是很多人喜欢linux的原因，比较短小但却功能强大。我将我了解到的命令列举一下，仅供大家参考：系统信息arch 显示机器的处理器架构uname -m 显示机器的处理器架构uname -r 显示正在使用的内核版本 dmideco...
2019-12-03 15:41:53
107
转载 linux 常用指令
lsls -a 显示指定目录下所有目录与文件，包括隐藏文件 -l 以列表的方式显示文件的详细信息 -h 配合-l以人性化的方式显示文件大小 隐藏文件和隐藏文件夹是用来配置应用的。cd change directory 的缩写，其功能为更改当前的工作目录，也是用户最常用的命令之一。cd 回到家目录（/home/用户目录）cd~ 回到家目录（/home/...
2019-12-03 15:26:08
477
转载 CommonJS的模块实现原理
如果要输出一个键值对象{}，可以利用exports这个已存在的空对象{}，并继续在上面添加新的键值；如果要输出一个函数或数组，必须直接对module.exports对象赋值。所以我们可以得出结论：直接对module.exports赋值，可以应对任何情况：module.exports = { foo: function () { return 'foo'; }};或者：modu...
2019-11-19 11:11:42
526
原创 JS一些函数
this.dataform.UserIdList = this.strTrim(item.AuthValue, ',').split(',')strtrim用于裁切字符串的开头和尾部的空格，制表，回车符<script type="text/javascript">var str="Hello world!"document.write(str.indexOf("Hello"...
2019-11-14 09:49:59
111
原创 数组与字符串的相互转换
1、数组转字符串需要将数组元素用某个字符连接成字符串，示例代码如下：var a, b;a = [0,1,2,3,4];b = a.join(","); //"0,1,2,3,4"2、字符串转数组实现方法为将字符串按某个字符切割成若干个字符串，并以数组形式返回，示例代码如下：var str = "aaa,bbb,ccc";strArr = str.split(",");/...
2019-11-05 10:13:04
238
转载 char、nchar、varchar与nvarchar数据类型使用区别:
CHAR: CHAR存储定长数据很方便，CHAR字段上的索引效率级高，比如定义char(10)，那么不论你存储的数据是否达到了10个字节，都要占去10个字节的空间。VARCHAR:存储变长数据，但存储效率没有CHAR高。如果一个字段可能的值是不固定长度的，我们只知道它不可能超过10个字符，把它定义为 VARCHAR(10)是最合算的。NCHAR、NVARCHAR从名字上看比前面三种多了个“N”...
2019-11-04 17:17:54
209
原创 v-if与v-show区别
v-if和v-show都是用来控制元素的渲染。v-if判断是否加载，可以减轻服务器的压力，在需要时加载,但有更高的切换开销;v-show调整DOM元素的CSS的dispaly属性，可以使客户端操作更加流畅，但有更高的初始渲染开销。如果需要非常频繁地切换，则使用 v-show 较好；如果在运行时条件很少改变，则使用 v-if 较好。...
2019-11-01 15:37:23
62
原创 数据库操作---查询
1.查询所有列select * from 表名例：select * from classes;2.查询指定列select 列1，列2，...from 表名；select id,name from classes;3.增加说明：主键列是自动增长，但是在全列插入时需要占位，通常使用空值(0或者null) ; 字段默认值 default 来占位，插入成功后以实际数据为准1.全列插入...
2019-10-31 18:19:36
452
原创 数据库语句---表操作
1.查看表结构desc 表名2.创建表结构的语法create table table_name(字段名 数据类型 可选的约束条件）；demo：创建班级和学生表create table classes( id int unsigned auto_increment primary key not null, name varchar(10));create tab...
2019-10-31 18:06:08
106
原创 数据库语句---数据库操作
查看所有数据库show databases;查看当前使用的数据库select database();创建数据库create databases 数据库名 charset=utf8;删除数据库drop database 数据库名使用数据句库use database 数据库名查看数据库中所有表show tables;...
2019-10-31 18:01:22
70
原创 decimal数据类型的用法
FLOAT、DOUBLE、DECIMAL区别float：浮点型，4字节，32bit。double：双精度实型，8字节，64位decimal：数字型，128bit，不存在精度损失，常用于银行帐目计算。（28个有效位）decimal(M,N)M表示:不包括小数点，不包括符号位，所能存数字的总位数（包括小数部分和整数部分）N表示：小数部分数字的位数，由此可知整数部分的位数为M-N;DECI...
2019-10-31 17:55:06
12708
转载 onchange onpropertychange 和 oninput 事件的区别
汇总 onchange onpropertychange 和 oninput 事件的区别1、onchange 事件与 onpropertychange 事件的区别：onchange 事件在内容改变（两次内容有可能还是相等的）且失去焦点时触发。onpropertychange 事件却是实时触发，即每增加或删除一个字符就会触发，通过 js 改变也会触发该事件，但是该事件 IE 专有。oninp...
2019-10-28 19:30:25
143
转载 watch，computed和methods的关系
watch，computed和methods的关系1.watch和computed都是以Vue的依赖追踪机制为基础的，它们都试图处理这样一件事情：当某一个数据（称它为依赖数据）发生变化的时候，所有依赖这个数据的“相关”数据“自动”发生变化，也就是自动调用相关的函数去实现数据的变动。2.对methods:methods里面是用来定义函数的，很显然，它需要手动调用才能执行。而不像watch和com...
2019-08-17 18:38:41
117
原创 vue常用指令
常用指令v-text作用： 更新元素的 textContentv-html作用： 更新元素的 innerHTMLv-bind作用：当表达式的值改变时，将其产生的连带影响，响应式地作用于 DOM语法：v-bind:title="msg"; 简写：:title="msg"v-on作用：绑定事件语法：v-on:click="say" or v-on:click="say...
2019-08-03 14:49:18
101
原创 vue 双向数据绑定原理
vue 双向数据绑定原理利用了es5中的一个方法.Object.defineproperty(),它有三个参数,Object.defineproperty(obj,‘val’,attrObject),参数1: obj是属性所在的对象,参数2: ‘val’,属性名,它是一个string类型,参数3: { }属性所描述的对象详情可以看Object.defineproperty的文档 ...
2019-08-02 22:57:21
75
转载 vue.js 学习日记（二）
Vue组件全局注册/局部注册局部注册组件在子组件中不可用全局注册的行为必须在根Vue实例创建之前发生camelCase的属性可以在组件中使用 kebab-case可以以对象的模式指定每一个 props属性的类型父级 props的更新会向下流动，反之则不行由于JavaScript对象和数组是引用传入的，所以当子组件对props的改变将会影响到父组件pr...
2019-08-02 20:52:52
129
原创 vue.js学习日记（一）
Vue.js是当下很火的一个JavaScript MVVM库，它是以数据驱动和组件化的思想构建的。相比于Angular.js，Vue.js提供了更加简洁、更易于理解的API，使得我们能够快速地上手并使用Vue.js。，因为Vue.js是数据驱动的，无需手动操作DOM。它通过一些特殊的HTML语法，将DOM和数据绑定起来。一旦你创建了绑定，DOM将和数据保持同步，每当变更了数据，DOM也会相应地更新...
2019-08-02 20:36:10
228
1
转载 VUE——MVVM框架理解
MVVM工作原理MVVM框架理解MVVM的实现原理响应式：模板解析：如何将模板渲染为html小白一枚，正好最近Vue越来越火热，Github上的Star数已经超过了React。而其背后蕴含的MVVM框架思想也一直跟React的组件化开发思想并驾齐驱，在这里也是本着兼收并蓄的思想，多了解一种开发模式。因此通过一些学习资料，写一些自己对MVVM开发思想的理解。废话不多说，咱们进入正题。MVVM框...
2019-07-31 21:11:45
330
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人