自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 vue3 - rem适配 (学者说)

一、安装插件 npm i postcss-pxtorem lib-flexible -D二、postcss.config.jsmodule.exports = { plugins: { 'autoprefixer': { browsers: ['Android >= 4.0', 'iOS >= 8'] }, 'postcss-pxtorem': { rootValue: 37.5, propLi

2021-03-01 19:32:22 182 1

原创 http和https的区别 (学者说)

http和https的区别Http:超文本传输协议(Http,HyperText TransferProtocol)是互联网上应用最为广泛的一种网络协议。设计Http最初的目的是为了提供一种发布和接收HTML页面的方法。它可以使浏览器更加高效。Http协议是以明文方式发送信息的,如果黑客截取了Web浏览器和服务器之间的传输报文,就可以直接获得其中的信息。Https:是以安全为目标的Http通道,是Http的安全版。Https的安全基础是SSL。SSL协议位于TCP/IP协议与各种应用层协议之

2021-03-01 09:53:21 138

原创 cookie、localStorage、sessionStorage区别(学者说)

cookie、localStorage、sessionStorage区别cookieCookie设计初衷是用来和服务器通讯,而不是本地存储,他只是被‘借用’到本地存储如下图,每次http请求,header都携带cookie;localStorage、sessionStorage在HTML5中,新加入了一个localStorage/sessionStorage特性,这个特性主要是用来作为本地存储来使用的,解决了cookie存储空间不足的问题(cookie中每条cookie的存储空间为4k),l

2021-03-01 09:42:50 129

原创 数组的方法(学者说)

数组的方法以及返回值 push: 向数组的末尾增加一项 返回值是数组的新长度 var arr = ['a','b','c','d','e','f','g','h'] var arr1 = arr.push('Hello') console.log(arr1); // 返回值是数组的新长度 - 9 console.table(arr) // 向数组的末尾增加一项 ['a','b','c','d','e','f','g','h','Hello'] unshift: 向数组开头增加一.

2021-01-21 19:37:56 177

原创 五大浏览器(学者说)

五大浏览器背景介绍IE浏览器:IE是微软公司旗下浏览器,是目国内用户量最多的浏览器。IE诞生于1994年,当时微软为了对抗市场份额占据将近百分之九十的网景Netscape Navigator,于是在Windows中开发了自己的浏览器Internet Explorer,自此也引发了第一次浏览器大战。结果可想而知,微软大获全胜,网景不得不将自己卖给AOL公司。但实际上事情并没有结束,网景后来开发了风靡一时的Firefox火狐,至今Firefox也成为世界五大浏览器之一。1996年,微软从Spygla

2021-01-20 21:21:06 145

原创 五大浏览器你了解吗?(学者说)

主流浏览器及内核一、 主流浏览器IE浏览器(Internet explorer)现在的新版本是(Microsoft Edge)火狐浏览器(Firefox)谷歌浏览器(Chrome)苹果浏览器(Safari)欧朋浏览器(Opera)二、浏览器内核浏览器内核可以分成两部分: 渲染引擎(layout engineer 或者 Rendering Engine)和 JS 引擎。渲染引擎它负责取得网页的内容(HTML、XML、图像等等)、整理讯息(例如加入 CSS 等),以及计算网页

2021-01-20 21:16:15 3047

原创 DOM (学者说)

DOM文章目录DOM的概念DOM编程的作用节点与节点树如何获取HTML标签元素DOM的概念DOM的概念 : DOM(Document Object Model)即文档对象模型,和文档内容进行交互的方法和接口。DOM编程的作用通过可编程的对象模型,JavaScript 得到了足够的能力来创建动态的 HTMLJavaScript 能够改变页面中的所有 HTML 元素JavaScript 能够改变页面中的所有 HTML 属性JavaScript 能够改变页面中的所有 CSS 样式Java

2021-01-20 20:33:02 130

原创 自定义指令-拖拽(学者说)

vue - 自定义指令 -拖拽directives: { go: { inserted(el) { //给el设置绝对定位 el.style.position = 'absolute' //给el添加鼠标按下的事件 el.onmousedown = function (event) { //用视口的位置减去相对于父元素的位置得到一个距离差 var sx = event.clientX - el.offsetLeft

2021-01-18 20:44:42 120

原创 src和href的区别(学者说)

src与href的区别href 是指向网络资源所在位置,建立和当前元素(锚点)或当前文档(链接)之间的链接,用于超链接。src是指向外部资源的位置,指向的内容将会嵌入到文档中当前标签所在位置;在请求src资源时会将其指向的资源下载并应用到文档内,例如js脚本,img图片和frame等元素。当浏览器解析到该元素时,会暂停其他资源的下载和处理,直到将该资源加载、编译、执行完毕,图片和框架等元素也如此,类似于将所指向资源嵌入当前标签内。这也是为什么将js脚本放在底部而不是头部。...

2021-01-18 20:42:26 105

原创 时间戳的转换(学者说)

时间戳首先在编辑器安装插件A-super-comprehensive插件在转变时间得页面定义一个filters例子要和钩子函数他们平级mounted() {},filters: {}//转换时间filters: { time(curTime) { var nd = new Date(curTime * 1000); var y = nd.getFullYear(); var mm = nd.getMonth() + 1; var d = nd.getDate();

2021-01-18 20:34:38 110

原创 css Hack (学者说)

css Hack什么是CSS Hack?一般来说是针对不同的浏览器写不同的CSS,就是 CSS Hack。CSS Hack常见的有三种形式:属性Hack选择符Hack条件注释Hack注: Hack主要针对IE浏览器例如:条件Hack<!--[if IE]> <p>你在非IE中将看不到我的身影</p><![endif]--><!--[if IE]><style> .test{col

2021-01-18 20:12:00 153

原创 盒模型 (学者说)

盒模型什么是盒模型?盒子模型 是css中一个重要的概念,理解了盒子模型才能更好的排版。盒子模型有两种,分别是ie盒子模型(怪异盒模型)和标准 w3c 盒子模(标准盒模型)型。常说的盒模型呢,其实就是元素也就是标签,所有的标签都是盒模型如何计算盒模型的宽度?标准盒模型左右外边距(margin)+ 左右边框(border) + 左右内边距(padding) + 宽度(width)box-sizing:border-box; 注:标准盒模型转变为怪异盒模型怪

2021-01-18 19:26:26 112 1

原创 vue项目的多环境配置 (学者说)

多环境配置package.json 里的 scripts 配置 serve stage build,通过 --mode xxx 来执行不同环境"scripts": { "serve": "vue-cli-service serve --open", "stage": "vue-cli-service build --mode staging", //添加这行代码 "build": "vue-cli-service build",} 配置介绍以 VUE_APP_ 开头的变量,

2021-01-18 17:16:54 184

原创 节流函数 (学者说)

节流函数 定义 规定在一个单位时间内,只能触发一次函数,如果这个单位时间内触发多次函数,只有一次生效; 典型的案例就是鼠标不断点击触发,规定在n秒内多次点击只有一次生效。 实现原理 原理是用时间戳来判断是否已到回调该执行时间,记录上次执行的时间戳,然后每次触发 scroll 事件执行回调,回调中判断当前时间戳距离上次执行时间戳的间隔是否已经到达 规定时间段,如果是,则执行,并更新上次执行的时间戳。 应用场景 拖拽:固定时间内只执行一次,防止超高频次触发位置变缩放:监控浏览器resiz

2021-01-18 14:52:01 388

原创 防抖函数 (学者说)

防抖函数 防抖 的目的是为了减少不必要的计算,不浪费资源,只在适合的时候再进行触发计算。 定义 在事件被触发n秒后再执行回调,如果在这n秒内又被触发,则重新计时;典型的案例就是输入搜索:输入结束后n秒才进行搜索请求,n秒内又输入的内容,就重新计时。 实现原理 函数防抖的基本思想是设置一个定时器,在指定时间间隔内运行代码时清除上一次的定时器,并设置另一个定时器,直到函数请求停止并超过时间间隔才会执行。 使用场景搜索:每输入一个字符就会执行一次,这就可以使用防抖。 vue中防抖的演

2021-01-18 12:04:51 215

原创 vue优化-配置alias别名(学者说)

webapck优化——配置alias别名配置别名使用vue-cli开发项目,最大特色是组件化。组件中频繁引用其他组件或插件。我们可以把一些常用的路径定义成简短的名字。方便开发中使用。//加载path模块const path = require('path')//定义resolve方法,把相对路径转换成绝对路径const resolve = dir => path.join(__dirname, dir)module.exports = { chainWebpack: confi

2021-01-11 16:20:31 209

原创 虚拟DOM diff算法(学者说)

虚拟Dom和diff算法虚拟Dom的概念:虚拟DOM的本质就是一个JS对象,虚拟DOM减少了真实DOM的操作,当修改数据的时候,就是修改虚拟DOM产生全新的虚拟DOM新旧虚拟DOM使用diff算法,得到patch(也就是需要修改的部分),然后将这个patch打到浏览器的DOM上(减少重绘和回流,从而达到性能优化的目的)每次DOM操作会引起重绘或者回流,频繁的真实DOM的修改会触发多次的排版和重绘相当耗性能优点:虚拟DOM提高性能,减少操作DOM的次数,减少回流和重绘虚拟 dom 相当于在

2021-01-09 07:53:42 171

原创 csdn字体颜色(学者说)

字体的颜色和大小设置颜色的两种形式<font color=#00FF7F size=6 >字体的颜色和大小</font> # 16进制表示法<font color=blue size=6 >字体的颜色和大小</font> # 单词表示法我是大小为3的蓝色我是大小为4的红色设置字体的方法<font color=#FFA07A size=4 >设置字体的方法</font> # 只需

2021-01-08 17:22:51 144 1

原创 Vue数据双向绑定(学者说)

vue数据双向绑定前言一、重点词汇 Object.defineProperty()二、实现具体步骤话术总结前言 vue.js是采用数据劫持结合发布者-订阅者模式的方式,通过 Object.defineProperty()来劫持各个属性的setter,getter,在数据变动时发布消息给订阅者,触发相应的监听回调来渲染视图。一、重点词汇 Object.defineProperty()对象是由多个键/值对组成的无序的集合。对象中每个属性可以是任意类型的值。定义对象可以使用构造函数或字面量

2021-01-08 16:49:53 96

原创 vue项目开发流程(学者说)

超级详细的开发项目的流程前言: 拿到一个项目任务首先了解是一个什么样的项目,项目开发中有没有什么外部的文件(css, js, json,icon)等需要配合完成项目的开发,确认开发的项目方向从而确定是否需要搭配那些依赖的配合开发以及合适的组件库的安装以及引入(Element-ui 、Vant-ui 、Mint UI 、Bootstrap Vue)等,达到不论从用户使用中的视觉体感以及编程开发中的编程思路清晰明了。项目开发前我们进行如下操作第一步 (安装vue脚手架 ---- npm install

2021-01-04 18:19:41 227 1

原创 Vant-ui 按需引入(读者说)

Vant-ui 按需引入前言: babel-plugin-import 是一款 babel 插件,它会在编译过程中将 import 的写法自动转换为按需引入的方式。第一步 安装插件 npm i babel-plugin-import -D第二步 创建.babel.config.js文件*module.exports = { plugins: [ ['import', { libraryName: 'vant', libr

2020-12-29 09:33:10 148

原创 scss混合”mixins“使用(学者说)

Vue中scss混合(mixins)使用前言:使用混合mixins中的变量来定义一个n行文本溢出隐藏的公共样式第一步(创建mixins.scss文件)建议可以将其创建在src目录下的assets(项目中的静态文件目录)下,创建css公共样式目录里创建文件mixin.scss //$clamp 是变量,可以自定义最多显示几行文本 @mixin ellipsisBasic($clamp:1) { overflow: hidden; te

2020-12-29 09:30:52 592

原创 原型与原型链(学者说)

原型与原型链1. prototype每个函数都有一个prototype属性,被称为显示原型2._ proto _每个实例对象都会有_ proto _属性,其被称为隐式原型每一个实例对象的隐式原型_ proto _属性指向自身构造函数的显式原型prototype3. constructor每个prototype原型都有一个constructor属性,指向它关联的构造函数4. 原型链获取对象属性时,如果对象本身没有这个属性,那就会去他的原型__proto__上去找,如果还查不

2020-12-28 07:51:03 148

原创 Es6中的class(学者说)

calss的使用ES6中引入了class(类)这个概念,通过class关键字可以定义类。该关键字的出现使得javascript在对象写法上更加清晰,更像是一种面向对象的语言 class Student { constructor(name, number) { this.name = name this.number = number } sayHi() { console.log(`姓名${this.name},学号${this.num

2020-12-28 07:43:14 112

原创 深拷贝(学者说)

深拷贝深拷贝:创建一个新的对象和数组,将原对象的各项属性的值(数组的所有元素)拷贝过来,是值而不是’引用let obj = { a:100, b:200, arr:[44,55,66], address:{ city:'shanxi' } } var obj2 = deepClone(obj) obj2.address.city = "beijing" console.log(obj) // obj.address.city:"shanxi"

2020-12-27 18:56:59 82

原创 vue项目开发前的简单部署(学者说)

关于一个项目开发前的准备1.node.js环境搭建和npm的安装安装完成后运行cmd命令,输入node -v出现下图提示的版本号就表示安装成功了2.安装全局vue-cli 脚手架(1)安装命令:npm install -g vue-cli 回车,等待安装;(如果不全局-g,只能在指定目录下使用脚手架)(安装后通过命令 vue -V 查看版本号,有版本信息即可确定已经安装成功)(2)创建项目:vue init webpack (文件夹名),回车,成功后出现项目文件夹(3)启动项目:npm

2020-12-15 20:26:50 131

原创 class&继承(学者说)

ES6 - class和继承前言:传统的javascript中只有对象,没有类的概念。它是基于原型的面向对象语言。原型对象特点就是将自身的属性共享给新对象。这样的写法相对于其它传统面向对象语言来讲,独树一帜也可以说难以接受!ES5中的类 ES5中如果要生成一个对象实例,需要先定义一个构造函数,然后通过new操作符来完成。//构造函数名大写(非强制,但这么写有助于区分构造函数和普通函数)function Person(name,age) { this.name = name;

2020-11-24 21:58:17 144

原创 ES6 - 解构赋值(学者说)

ES6解构赋值 前言:解构赋值语法是一种JavaScript表达式。通过解构赋值,可以将属性/属性值从对象/数组中取出,然后赋值给其他变量语法 数组解构var a,b,rest;[a,b] = [10,20];console.log(a) // 10console.log(b) // 20 对象赋值({a,b} = {a:10,b:20})console.log(a) // 10console.log(b) // 20 ...rest 解构对象({a,b,...re

2020-11-24 21:10:48 88

原创 ES6 上(学者说)

ES6简介:什么是ES6? ES的全称是ECMAScript,它是由ECMA国际标准化组织制定的一项脚本语言的标准化规范。 ES6实际上是一个泛指,泛指ES2015及后续的版本。(每年的6月更新一次,区别以年份命名,如:ES2015)。年份版本2015年6月ES20152016年6月ES20162017年6月ES20172018年6月ES2018……原因分析:提示:这里填写问题的分析:例如:Handler 发送消息有两种方式,

2020-11-23 20:56:58 80

原创 Github(学者说)

Github前言:如今的编程,早已不是单打独斗的模式了。优秀的编程人员,甚至是初学者,都必须学会如何与他人高效协作。Github是编程协作中须要掌握的基础知识。如何尽快入门,少走弯路呢?希望读过本文,你能获得一些帮助。GitHub 是一个面向开源及私有软件项目的托管平台,因为只支持 Git 作为唯一的版本库格式进行托管,故名 GitHub。GitHub 于 2008 年 4 月 10 日正式上线,除了 Git 代码仓库托管及基本的 Web 管理界面以外,还提供了订阅、讨论组、文本渲染、在线文件编

2020-11-23 00:33:11 104

原创 git起步的基础(学者说)

关于GIT — 版本管理系统 前言:git是版本管理控制系统,它可以再任何时间点将自己的编辑文档状态作为更新记录进行保存。 反之:也可以在任何时间点将编辑、更新的文档回复回来。在进行git使用配置前首先我们要进行提交人的信息进行配置。查询git配置信息 $git config --listgit提交信息操作git init (初始化git仓库)git status (查看文件夹状态)***git init 在项目目录里初始化git仓库 ***git

2020-11-21 01:42:35 99

空空如也

空空如也

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

TA关注的人

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