自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 前端面试题题题题题

html CSSpch5新增的属性亮点websocketweb wokerservice woker盒模型亮点怪异盒模型标准和模型响应式布局亮点自己实现栅格系统视口BFC移动端300ms延时不同的手机根据什么适配1像素弹性盒JSES5原型原型链面向对象闭包闭包作用域this指向ES6新特性数组常用方法promise异步宏任务微任务并发实现一个多并发怎么操作给两个接口’/api’ ‘/user’,问使用并发怎么实现数据返回,同时启用两

2021-03-31 19:43:06 129 1

原创 鼠标右键禁用

通过禁用右键选项卡的方式来禁用复制粘贴以及其他操作。JS 中的 button 事件属性来实现鼠标右键的禁用。通过弹出提示框来代替右键选项卡。button 事件属性用于当事件被触发时哪个鼠标按键被点击,它返回一个整数,描述参数规定鼠标左键0规定鼠标中键1规定鼠标右键2event.button==0|1|2;function click() { if (event.button==2) { alert('对不起,本页禁用右键!') } }

2021-03-30 08:57:41 370 2

原创 导航吸顶效果

HTML<div class="container"> <header></header> <div class="mark"></div> <div class="content"> <ul> <li> <p class="title">导航01</p> &l

2021-03-29 11:26:27 137

原创 用纯CSS实现吸顶效果

HTML<div class="header"></div><nav> 吸顶的头</nav><div class="content"></div><footer> 底部</footer>CSS.header { width:100%; height:160px; background:#87CEEB;}nav { width:100%; height:100p

2021-03-29 11:16:06 682

原创 CSS布局两边固定中间自适应

两边固定中间自适应利用浮动(float)让左右元素浮动,缺点是中间元素必须置于二者之后,不然right元素会进入下一行 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"&g

2021-03-26 16:22:47 330

原创 CSS布局两边固定中间自适应

两边自适应中间固定flex布局(利用flex-grow进行布局)<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> *{ margin:0; padding:0; } .wrap{ display:flex; flex-dir

2021-03-26 16:08:03 101

原创 Axios的使用

Axios是尤雨溪大神推荐使用的,它也是对原生XHR的二次封装。Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中。Axios安装 安装: npm install axios --save 引入: import Axios from './axios' 使用 :Vue.prototype.axios = Axios;(全局注册 在使用时可以使用this.$axios使用)特性:可以在Node环境中配合Express()使用实现异步的数据交互提

2021-03-26 14:28:11 171

原创 合并对象的几种方法

for in 遍历合并var obj1={name:"men",age:24}var obj2={myname:"qq",age:18}//for in 遍历合并for(let err in obj2){obj1[err]=obj2[err];}console.log(obj1)//{name:"men",age:24,myname:"qq",age:18}...语法合并var obj3={...obj1,...obj2};console.log(obj3);//{name.

2021-03-24 17:06:59 536

原创 解决nodejs端口被占用问题

npm install killport2 -g如果3000端口被占用,直接: killport 3000拜

2021-03-24 14:15:10 483

原创 查看被占端口号,及关闭被占用到端口

在开启服务器时会遇到端口号被占用的一些情况,例如8080:打开cmd,输入netstat -ano,查看所有端口号的PID值时多少找出占用的8080端口netstat -ano | findstr 8080,指令意思是找出8080端口的进程pid终止进程:taskkill -pid 8080 -f 关闭成功拜...

2021-03-24 14:13:18 180

原创 谷歌浏览器字体小于12px解决方法

谷歌浏览器最小字体尺寸是12px,想要调成更小的字体,缩放 transformH5获取mac地址 js调用摄像头

2021-03-23 09:38:55 3281

原创 服务器代理-负载均衡

关于前端平滑升级的问题:假如有两台服务器(server3000和server7000),这两台服务器上分别部署了相同的前端静态文件(index.html index.js)【咱学的服务端都是用node去做的服务端【部署静态文件就是把前端写好的静态页面放到plugin目录里放(也就是往静态资源目录里放)】】如果server3000中的静态资源被更新了,那么此时会出现什么问题?如何解决?为什么要放在两台服务器:为了分担服务器压力,一般用户量特别大的时候都会分多台服务器,加入了更多的服务器压力肯定就小了这是

2021-03-19 20:21:28 535 1

原创 说说你对v-model 原理的理解?

v-model是什么?v-model本质就是一个语法糖,可以看成是value + input方法的语法糖。 可以通过model属性的prop和event属性来进行自定义。原生的v-model,会根据标签的不同生成不同的事件和属性。 // 标准写法 <input v-model="name"> // 等价于 <input :value="name" @input="name = $event.target.value"> // 在组件上面时 <div :va

2021-03-19 11:55:58 785

原创 你是如何理解Vue 的单向数据流?

单向数据流?数据从父级组件传递给子组件,只能单向绑定。子组件内部不能直接修改从父级传递过来的数据。所有的 prop 都使得其父子 prop 之间形成了一个单向下行绑定:父级 prop 的更新会向下流动到子组件中,但是反过来就不行。这样会防止从子组件意外改变父级组件的状态,从而导致你的应用的数据流向难以理解。另外,每次父级组件发生更新时,子组件中所有的prop都将会刷新为最新的值。意味着你不应该在一个子组件内部改变prop。如果你这样做了,Vue会在浏览器的控制台发出警告。子组件想修改时,只能通过

2021-03-19 11:16:33 375

原创 CSS布局flex布局常用属性

display: flex 使用 flex 布局首先要设置父容器;水平方向: justify-content: flex-start;起始端对齐 justify-content: flex-end;末尾段对齐 justify-content: center;居中对齐 justify-content: space-around;均匀分布 justify-content: space-between;两端对齐,中间均匀分布垂直方向:

2021-03-16 20:49:24 253

原创 CSS边框,实线、虚线、破折号

border:1px solid red; /*实线*/border:1px dotted red; /*虚线*/border:1px dashed red; /*破折号*/

2021-03-16 20:46:45 1189

原创 CSS 隐藏页面上的一个元素有哪几种方法?

display:none,visibility:hiden,opacity:0 这三种;设置 fixed 并设置足够大负距离的 left top 使其“隐藏”;用层叠关系 z-index 把元素叠在最底下使其“隐藏”;用 text-indent:-9999px 使其文字隐藏。还有Position,Clip-pathPosition将元素的 top 和 left 设置成足够大的负数,使它在屏幕上不可见。.hide{position:absolute;top:-9999px;left:

2021-03-16 11:52:39 256

原创 比较opacity:0、visibility:hidden、display:none,优劣和适用场景

display: noneDOM 结构:浏览器不会渲染 display 属性为 none 的元素,会让元素完全从渲染树中消失,渲染的时候不占据任何空间;事件监听:无法进行 DOM 事件监听,不能点击;性能:修改元素会造成文档回流(reflow 与 repaint),读屏器不会读取display: none元素内容,性能消耗较大;继承:是非继承属性,由于元素从渲染树消失,造成子孙节点消失,即使修改子孙节点属性子孙节点也无法显示,毕竟子类也不会被渲染;场景:显示出原来这里不存在的结构;tran..

2021-03-16 11:45:34 1215

转载 回流与重绘 (Reflow & Repaint),及如何进行优化?

浏览器使用流式布局模型 (Flow Based Layout)。浏览器会把HTML解析成DOM,把CSS解析成CSSOM,DOM和CSSOM合并就产生了Render Tree。有了RenderTree,我们就知道了所有节点的样式,然后计算他们在页面上的大小和位置,最后把节点绘制到页面上。由于浏览器使用流式布局,对Render Tree的计算通常只需要遍历一次就可以完成,但table及其内部元素除外,他们可能需要多次计算,通常要花3倍于同等元素的时间,这也是为什么要避免使用table布局的原因之一。.

2021-03-16 11:29:50 211

原创 webP是什么?相对于 PNG、JPG有什么优势?

WebP 在各大互联网公司已经使用得很多了,国外的有 Google(Chrome Store 甚至已全站使用 WebP)、Facebook 和 ebay,国内的有淘宝、腾讯和美团等。webP是什么?WebP为网络图片提供了无损和有损压缩能力,同时在有损条件下支持透明通道。webP优势WebP 的优势体现在它具有更优的图像数据压缩算法,能带来更小的图片体积,而且拥有肉眼识别无差异的图像质量;同时具备了无损和有损的压缩模式、Alpha 透明以及动画的特性,在 JPEG 和 PNG 上的转化效果都相当优秀

2021-03-16 11:06:58 1290

原创 git拉取代码

git add .git commit -m '优惠券'git pull

2021-03-16 09:03:49 127

原创 mysqld: Can‘t create directory ‘/usr..‘ [Warning] TIMESTAMP with implicit DEFAULT value is deprecate

mysql远程连接过程中,报错:原因是 在当前路径下没有找到需找到的文件,应把mysql从/opt/software/移入到/usr/local/下才能进行下一步操作移入mysql:mv /opt/software/mysql/ /usr/local/

2021-03-13 11:50:20 495

原创 pm2

pm2是node进程管理工具,可以利用它来简化很多node应用管理的繁琐任务,如性能监控、自动重启、负载均衡,而且使用非常简单。安装npm install -g pm2查看版本号,出现版本号下载成功pm2 --version安装npm i express-generator -g查看版本号创建文件夹express -e server2001a在server2001a中创建server,在server中npm i这时可以去浏览器试着加载但是:修改端口号:浏览

2021-03-11 20:03:15 97

原创 Linux下配置node

今天来整理一下在Linux环境下配置node包首先准备好,公网,Cmder登录自己公网,输入密码进入到/opt/software文件夹,初次使用software文件夹是不存在的,需要创建mkdir software进入到/opt/software文件夹后,下载node包:解压node包,解压后进入cd node-v14.16.0-linux-x64/配置node环境vim /etc/profile进入到编写模式 按i可以编写 在最后一行编写:export PATH

2021-03-11 16:16:05 616

原创 加载大量数据,出现卡钝或白屏现象

在以前公司开发的时候,有过开发表格的经历,表格呢我们一般使用element-Ui,element-Ui这个表格它其实有一个致命的缺点,它会出现加载大量数据,会卡顿的现象,就是它会出现一个白屏。如何解决它的卡顿现象:加载大量数据一直是个历史性难题,一般情况下在做:报表,所有的表跟数据加载到一个里面了,以表格加载数据过大问题,它就会出现卡顿现象。其中有很多方案,例如:利用C3里的一些特性,让它在加载表格的时候,它不先加载这些东西,在向下拉的时候在去加载;虚拟渲染:它会让你感觉把所有数据加载完了,但实

2021-03-04 16:27:04 1738 2

原创 创建vue的组件的3种方式

局部组件全局组件插件式组件:封装一个全局的模态框,操作dom,vue当中不建议直接操作dom,它提供了install的方式去把组件引进来;

2021-03-04 09:36:36 138 2

原创 宏任务,微任务执行顺序

浏览器事件循环,那么意味着,必须是个闭环才能称之为循环。JS引擎也被成为,事件队列;JS执行队列,指的是它会按照先后顺序来执行;JS是单线程,之所以说单线程(没有办法去操作JS的多线程),是因为浏览器没有给JS去提供多线程,所以说它就是单线程;它没有给api让你开启一个多线程,它所有的东西都是给你安排好了,然后按照步骤一步一步执行,然后让你感觉它就是一个单线程;实际上,浏览器整个的JS实行机制它是一个多线程,不过这多线程的机制把握在v8内核引擎里面,v8内核引擎它是多线程;刚一开始进入到JS的时

2021-03-03 18:59:19 457 1

原创 vue.esm.js:628 [Vue warn]: Unknown custom element: <SlideBar> - did you register the component corre

vue.esm.js:628 [Vue warn]: Unknown custom element: - did you register the component correctly问题根源注册组件时注册反了;应先新建VUE实例再注册组件是,调转一下顺序即可解决

2021-03-02 16:37:56 1842

原创 history模式刷新404;vue.esm.js:628 [Vue warn]: Cannot find element: #app

history模式刷新404的问题:就是它向服务器发送请求了当我搭建路由的时候,使用hash的时候非常友好,为什么,使用history路由的时候会报错;这里如果是history的话它会做一件事情;当我们访问接口,或者访问路由的话,就是我们的浏览器会向后端发送一个请求,而后端没有这个接口,会导致当前地址没找到,一旦没找到地址屏幕会显示空白。所以说它默认会把main当成服务器接口的地址请求。怎么让它不按照接口的方式请求,默认是按照路由里面去找,去webpack.dev.js里面找一个devSer

2021-03-02 16:05:18 260

原创 webpack线上和线下请求地址有什么不同?

不知道小伙伴们面试的时候有没有被问到过:线上和线下请求地址又什么不同?或者是,你开发的时候请求地址是线上测试还是线下测试???区别就在于它们的代理地址。线下测试127.0.0.1就是线下测试也就是本地测试;再有呢也可以就是你们公司的局域网:192.168.1.123(这个呢是你们公司局域网的IP),这是线下测试;线上测试就是,你代理的地址不就是IP地址了,有可能是一个远程地址,长得像118.89.234.135这样,有可能还会是一个域名。这些属于线上测试;当然真正开发的时候真正上线的时候肯定是

2021-03-01 17:03:35 545

空空如也

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

TA关注的人

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