- 博客(45)
- 收藏
- 关注
原创 nrm的使用
nvm全称Node Version Manager是 Nodejs 版本管理器,它让我们能方便的对 Nodejs 的版本进行切换。安装 npm install -g nrm,全局安装nrm执行命令nrm ls查看可选的源。带*的是当前使用的源,上面的输出表明当前源是picahealth源。如果要切换到taobao源,只需要执行命令nrm use taobao即可。你可以增加定制的源,特别...
2019-11-06 13:24:19 232
原创 GitHub与gitlab的使用
这里以vscode为例1.git clone 地址2.将本机ssh放在自己的gitlab上注意:windows下 vscode在拉取的时候输入密码不可见。。新建test.htmlgit init初始化 创建空仓库git status查看状态 这时test.html报红 表示git生效git add test.html把文件或者修改添加到git缓存队列 并没有正式托管git sta...
2019-11-06 13:16:23 187
原创 前端页面构成
前端页面构成?分别有哪些功能?1)结构层(html)structural layer 由HTML或者XHTML之类的标记语言负责创建,即:标签;2)表示层(css)presentation layer 解决结构层如何显示的问题。3)行为层(js)behavior layer 内容如何对事件作出反应一类的问题解决。...
2019-09-30 15:38:06 591
原创 css/sass/scss/less认知
css(cascadiing style sheets层叠样式表)SASS是用Ruby语言写的,两者的语法没有关系,使用时先安装Ruby,再安装SASS。Scss 是sass 3引入的新语法,其语法完全兼容css3,并且继承了sassLess是一门CSS预处理语言,它扩展了CSS语言,增加了变量,Mixin,函数等特性,使CSS更易维护和扩展。Less可以运行在Node或者浏览器端。后缀名....
2019-09-30 15:34:58 1626
原创 new操作符做了什么事情
1.创建一个空对象,继承构造函数的prototype(继承公共方法)2.绑定this到新创建的对象,执行构造函数(创建实例的成员变量)3.由构造函数返回的对象就是 new 表达式的结果注意:1)箭头函数不能作为构造函数,因为箭头函数没有自己的this,所以不可以使用new。2)如果构造函数在调用时,没有加new操作符,执行过程中this会为window/undefined,无法正常生成实...
2019-09-30 15:27:37 459
原创 前端性能优化
减少HTTP请求:比如css精灵,懒加载压缩图片和使用图片Spirit技术(图片精灵)减少对DOM的操作CDN加速(最近的节点上)(内容分发网络)(就是将一些常用的文件,比如jq类库放在速度更快的服务器上,比如百度的cdn,提高加载速度)尽量使用css3动画(css3会开启GPU加速)requestAnimationFrame,加快动画速度。尽可能重绘(如果通过设置style属性改变结点...
2019-09-30 15:23:46 96
原创 localStorage,sessisonStorage ,session与cookie
local storage session 在幕布中有更新 以后再说
2019-09-30 14:57:35 180
原创 ajax和json的优缺点
ajax和json的优缺点ajax的概念:ajax是一种通过后台与服务器进行少量的数据交换,使页面实现异步更新。是一种创建交互式网页应用的网页开发技术。json的概念:json是一种轻量级的数据交换格式,具有良好的可读和便于快速编写的特性ajax优点:异步请求响应快,用户体验好;页面无刷新、数据局部更新;按需取数据,减少了冗余请求和服务器的负担;缺点:异步回调问题、this指向问题...
2019-09-26 13:48:42 354
原创 css hack ie6-8下hack是什么
css hack在不同浏览器下的不同ie6-8下hack是什么针对不同的浏览器写不同的CSS code的过程,就是CSS hack。#test{ width:300px; height:300px; background-color:blue; /*firefox*/ background-color:red\9; /*all...
2019-09-26 13:47:22 249
原创 图片的格式
图片的格式,有什么区别一、GIF(图形交换格式) GIF格式的图片最多只能保存256中颜色,该格式支持透明色,支持动画效果。二、JPEG(联合图像专家组) JPEG格式不支持透明色及动画,颜色可达1670种。三、PNG(网络可移植格式) PNG格式支持透明色,不支持动画,颜色从几种得到1670种。无压缩:无压缩的图片格式不对图片数据进行压缩处理,能够准确的呈...
2019-09-26 13:46:27 191
原创 如果一个大型网站有很多图片加载很慢,怎么优化
如果一个大型网站有很多图片加载很慢,怎么优化1.图片懒加载,在页面上的未可视区域可以添加一个滚动条事件,判断图片位置与浏览器顶端的距离与页面的距离,如果前者小于后者,优先加载。2.如果为幻灯片、相册等,可以使用图片预加载技术,将当前展示图片的前一张和后一张优先下载。3.如果图片为css图片,可以使用CSSsprite,SVGsprite,Iconfont、Base64等技术。4.如果图...
2019-09-26 13:44:36 3509
原创 rgba和opacity有什么区别
rgba和opacity有什么区别opacity属性的值,可以被其子元素继承,给父级div设置opacity属性,那么所有子元素都会继承这个属性,并且,该元素及其继承该属性的所有子元素的所有内容透明度都会改变。rgba()设置的元素,只对该元素的背景色有改变,并且,该元素的后代不会继承该属性。...
2019-09-26 13:43:12 343
原创 display:none和visiblity:hidden有什么区别
display:none和visiblity:hidden有什么区别1、display:none 不占页面空间,visiblity:hidden 占据原先页面空间。这里必须说明的是,元素不占页面空间后,取该元素或其内部元素的宽高值永远是0。如果想隐藏又想取到宽高值,那就得用visiblity:hidden。2、display:none 的子元素也一定无法显示,visiblity:...
2019-09-26 13:42:00 699
原创 src与herf的区别
src和href有什么区别?区别:src 的内容,是页面必不可少的一部分,是引入。href 的内容,是与该页面有关联,是引用。src用于替换当前元素,href用于在当前文档和引用资源之间确立联系。 src是source的缩写,指向外部资源的位置,指向的内容将会嵌入到文档中当前标签所在位置;在请求src资源时会将其指向的资源下载并应用到文档内,例如js脚本,img图片和frame等...
2019-09-26 13:38:45 478
原创 常见浏览器内核
常见的浏览器,他们的内核是什么?浏览器用的内核,一般不外乎微软的IE内核和webkit内核。所谓内核,就是常驻内存、能够快速响应的那一部分核心代码,非内核代码都是要用到时再调入内存并执行的。webkit内核更小巧快速,但兼容性不如IE内核。所以有些浏览器是用的双内核,可以在高速模式和兼容模式间切换。a、IE(IE浏览器) : trident 内核 -ms-b、Firefox(火...
2019-09-26 13:37:41 190
原创 doctype是什么,有什么作用
DOCTYPE是什么,有什么作用<!DOCTYPE> 声明大小写不敏感。用 W3C 的验证器来检查是否编写了有效的 HTML / XHTML 文档<!DOCTYPE> 声明必须是 HTML 文档的第一行,位于 <html> 标签之前。<!DOCTYPE> 声明不是 HTML 标签;它是指示 web 浏览器关于页面使用哪个HTML 版本进行...
2019-09-26 13:36:23 1500
原创 javascript是一门什么样的语言?有什么特性?
JS是门什么样的语言?有什么特性一、运行在客户端浏览器上的脚本语言、解释性语言 二、不用预编译,直接解析执行代码三、是弱类型语言,较为灵活,基于原型的语言,内置支持类型四、与操作系统无关,跨平台的语言五、解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML网页上使用,用来给HTML网页增加动态功能。JavaScript兼容于ECMA标准...
2019-09-26 13:34:26 1295 1
原创 AMD与CMD
鉴于目前这两种实现方式已经很少见到,所以不再对具体特性细聊,只需要了解这两者是如何使用的。// AMDdefine(['./a', './b'], function(a, b) { // 加载模块完毕可以使用 a.do() b.do()})// CMDdefine(function(require, exports, module) { // 加载模块 // 可以把 ...
2019-09-25 16:40:35 105
原创 js中的class本质
class继承是一种较为常用的继承方式,但是实质上,js中并没有类的概念,class实际上还是函数的语法糖class Person {}Person instanceof Function // true
2019-09-25 16:33:06 903
原创 ES6新特性let/var/const 箭头函数 解构 promise generator async/await等详解
let 与var const的区别let不存在变量提升变量提升(原生js的语法):在最上面定义变量,但是没有赋值相同的变量名不允许重复声明块级作用域(ES5内只有全局作用域 函数作用域)暂时性死区(也叫临时失效区),let声明的变量在当前函数内不允许同名的变量进来const:声明一个只读的变量,一旦声明,常量的值就不能改变。const实际上保证的,并不只是表面上的变量的值不得改动,而...
2019-09-23 21:43:23 1095
原创 移动端兼容有哪些常见问题
响应式布局响应式布局 @media (媒体查询)100%布局 弹性盒模型等比缩放布局(rem)还有就是机型兼容性 手机固有bug 某些IOS 设备上触发不了点击事件在元素上加pointer cursor点透事件苹果手机下 1px边框问题...
2019-09-23 14:06:04 385
原创 html5新特性
新的语义化标签,比如header、footer、nav,arcticle,sidebar等section video、audio新增表单控件: input type=“email/number/range…”新的选择器:querySelector和querySelectorAlljson方法: JSON.parse(字符串->对象)和JSON.stringfly()方法(对象->...
2019-09-23 13:59:03 244
原创 html相关
前端页面的构成?分别有哪些功能?1)结构层(html)structural layer 由HTML或者XHTML之类的标记语言负责创建,即:标签;2)表示层(css)presentation layer 解决结构层如何显示的问题。3)行为层(js)behavior layer 内容如何对事件作出反应一类的问题解决。行级元素 :多个占用一行 水平分布 不可以设置宽高span a i(用来写...
2019-09-23 00:26:03 125
原创 CSS居中(水平垂直)显示
1)如果有高度的话,margin: 0,auto就可以2)父元素设置为:position: relative; 子元素设置为:position: absolute; 距上50%,据左50%,然后减去元素自身宽度的距离就可以实现3)如果元素未知宽度,只需将上面例子中的margin: -50px 0 0 -50px;替换为:transform: translate(-50%,-50%);4)fl...
2019-09-23 00:12:12 99
原创 CSS外边距合并的解决方式
父元素加上 overflow:hidden;父元素加上边框 border:1px solid transparent父元素或子元素 浮动或者定位
2019-09-23 00:02:24 442
原创 CSS盒模型
一般来说提到盒模型就是标准盒模型跟IE浏览器下的怪异盒模型(也叫IE盒模型)ie6以及ie6以下的浏览器 不写doctype 就会表现成怪异。标准模型中,盒模型的宽高只是内容(content)的宽高,而在IE模型中盒模型的宽高是内容(content)+填充(padding)+边框(border)的总宽高。标准盒模型与怪异转化:box-sizing:content-box(标准) borde...
2019-09-23 00:00:42 85
原创 css浮动/BFC
float:分为左浮右浮 left/right浮动的元素会脱离文档流 空间释放 宽高由内容撑开子元素浮动会导致父元素高度塌陷如何解决父元素的高度塌陷问题给父元素加高度;clear属性的空标签:在浮动元素后添加一个空标签,并且在CSS中设置.clear{clear:both;}clear:both是css中清楚全部样式的意思,即可清理浮动。原理:添加一个空标签,利用CSS提高的...
2019-09-22 23:55:32 182
原创 css定位
absolute 绝对定位 定位后空间释放(使元素脱离文档流,不占用空间) 相对于最近已定位的祖先元素relative 相对定位 定位后空间不释放 相对于自己的初始位置定位fixed 固定定位 定位后空间释放 相对于浏览器的可视窗口static 默认的定位sticky 黏性定位 (可以用来做吸顶效果)...
2019-09-22 23:37:54 114
原创 css中的优先级
!important 优先级最高style 可以近似看作1000id 可以近似看作100class 可以近似看作10标签 可以近似看作1多用几次就有感觉了 熟能生巧嗷
2019-09-22 23:33:34 144
原创 css选择器
css选择器以及示例id选择器class选选择器标签选择器 a6后代选择器【以p元素为例】 (div p)子代选择器(div>p)伪类选择器(:hover/:link/:active等)伪元素选择器 ::after ::before【伪元素时行级元素】群组选择器 div,p属性选择器 div[id]后面紧邻的兄弟元素(div+p)后面所有的兄弟元素(div~p)...
2019-09-22 23:30:04 334
原创 ajax
ajax原理 核心是xmlhttprequest创建XMLHttpRequest对象向服务器发送请求 参数(请求方式,url ,是否是异步的)post需要单独设置一个请求头post的地址栏(url)不可以写参数post的参数是写在send里的服务器响应存有XMLHttpRequest的状态,从0到4发生变化0:请求未初始化1:服务器连接已建立2:请求已接...
2019-09-22 23:12:12 117
原创 js中的get/post
get post区别都是http请求方式的两种get是请求 post是提交get(ie2-4k)数据量小,post很大Get 放在地址栏不安全,post是在包体系里,相对安全get可以缓存 post不能一般获取数据用get 一般表单提交用post...
2019-09-22 22:50:09 292
原创 JS跨域
浏览器出于安全考虑,采用同源策略。同源策略:简单来讲同源策略就是浏览器为了保证用户信息的安全,防止恶意的网站窃取数据,禁止不同域之间的JS进行交互。对于浏览器而言只要域名、协议、端口其中一个不同就会引发同源策略,从而限制他们之间如下的交互行为:1.Cookie、LocalStorage和IndexDB无法读取;2.DOM无法获得;3.AJAX请求不能发送。跨域的严格一点的...
2019-09-22 22:43:39 131
原创 js任务
js是单线程的同步任务:同步任务指的是,在主线程上排队执行的任务,只有前一个任务执行完毕,才能执行后一个任务。异步任务:异步任务指的是,不进入主线程,而进入任务队列的任务,只有“任务队列”通知主线程,某个异步任务可以执行了,该任务才会进入主线程执行。=======================================================了解事件循环:所有的同步任...
2019-09-21 22:50:43 171
原创 节流-防抖
函数节流:定义:一个函数执行一次后,只有在大于设定的执行周期后才会执行第二次用途:如果有一个需要频发触发的函数,出于优化性能的考虑,在规定的时间内,只让其第一次生效,后面的不生效。 function throttle(fn,delay){ //定义throttle函数,delay是自定义的参数间隔时间 var startTime = 0; var nowTime= D...
2019-09-21 22:22:47 102
原创 js闭包
闭包闭包的概念:闭包是指有权访问另一个函数作用域中变量的函数,创建闭包的最常见的方式就是在一个函数内创建另一个函数,通过另一个函数访问这个函数的局部变量,利用闭包可以突破作用链域,将函数内部的变量和方法传递到外部。函数内再嵌套函数内部函数可以引用外层的参数和变量参数和变量不会被垃圾回收机制回收【外部函数执行完毕后,变量不释放,会保存在内存中】闭包的好处、应用:希望一个变量长期贮存...
2019-09-21 12:31:14 78
原创 js事件
首先理解事件的概念:JavaScript 创建动态页面。事件是可以被 JavaScript 侦测到的行为。 网页中的每个元素都可以产生某些可以触发 JavaScript 函数或程序的事件。比如说,当用户单击按钮或者提交表单数据时,就发生一个鼠标单击(onclick)事件,需要浏览器做出处理,返回给用户一个结果。事件源:发生事件的场所. 比如按钮被点击,那么事件源就是按钮;文本框获得焦点. 那么...
2019-09-21 11:57:05 128
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人