自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

smx

坚持便成习惯

  • 博客(52)
  • 资源 (4)
  • 收藏
  • 关注

原创 Niginx 配置前端代理服务器和常见问题

一、 nginx配置步骤首先在官网http://nginx.org/en/download.html下载nginx,下载它的稳定版本然后在nginx-1.16.1\conf下修改配置文件nginx.conf配置代理如下server {listen 8089;server_name localhost;...

2019-11-13 19:31:10 447

原创 Web前端性能优化(一)

减少http请求数、压缩js,css等文件Webpack使用使用CDN内容分发网络(Content Delivery Network,CDN)是建立并覆盖在承载网上,由不同区域的服务器组成的分布式网络。将源站资源缓存到全国各地的边缘服务器,供用户就近获取,降低源站压力,提高web端响应性能。具体的过程如下图,下面是阿里云CDN的工作原理图,DNS调度系统是阿里云部署解析IP。...

2019-09-11 19:08:32 429

原创 前端面试必须知道的技术点

1、diff算法(列表渲染key)2、原型和class子类必须在constructor方法中调用super方法,否则新建实例时会报错。这是因为子类自己的this对象,必须先通过父类的构造函数完成塑造,得到与父类同样的实例属性和方法,然后再对其进行加工,加上子类自己的实例属性和方法。如果不调用super方法,子类就得不到this对象。ES5 的继承,实质是先创造子类的实例对象this,然...

2019-08-30 19:16:00 1312

原创 防抖和节流

浏览器的resize,scroll,输入框内容校验、远程搜索,按钮点击等交互操作,如果这些操作对应的处理函数比较复杂(服务器请求、浏览器重渲染)时,事件触发的频率又无限制,会加重浏览器的负担,导致用户体验非常糟糕,防抖和节流是用来减轻浏览器的负担的,减少出发频率,同时又不影响效果的呈现。防抖减少事件触发的频率,控制函数在一定时间内的执行次数。防抖意味着N秒内函数只会被执行一次,如果N秒内再次...

2019-07-06 18:15:47 265

原创 csss实现的几种气泡小提示框

在开发中,我们经常会需要用到鼠标移到提示信息,然后经常会需要各式各样的提示框,首先我们要知道如下的三角形是怎么形成的。border属性三角形都是在content高度、宽度为0的情况下,灵活运用border属性来完成的,举个例子:<div><p class="star1"></p></div>.star1{ posi...

2019-07-02 18:50:33 1615

原创 javascript数组的总结和扩展

修改原数组的方法:splice/reverse/fill/copyWithin/sort/push/pop/unshift/shift原数组不变的方法:slice/map/forEach/every/filter/reduce/entries/find1、修改数组的:splice(index,num,item1,item2..) //index开始删除数组下标,num删除数量,item...

2019-05-30 18:02:01 239

原创 vue的响应式原理简化代码

vue.jsimport {Dep} from './dep'import {Compiler} from './compiler'class Observe{ obj:Object; constructor(obj){ this.obj = obj; this.walk(); } walk(){ let keys...

2019-05-30 18:00:21 202

原创 JavaScript实现排序算法

/*快排*/function quit_sort(arr) { if(arr.length<=1) return arr; let pivotIndex = Math.floor(arr.length/2); let pivot = arr.splice(pivotIndex,1)[0]; let leftArr =[]; let rightAr...

2019-05-30 15:23:19 159

原创 浏览器原理需要知道的事

前端开发—理解浏览器原理 任何语言都要被解析翻译成机器能读懂的语言,然后表现出我们想要的结果,前端我们熟知的css,javascript,html也需要被解析,然后在屏幕上绘制出我们想要的结果,然而这个过程是怎样去执行的呢?我们了解了这背后的原理对我们写代码有什么优化的效果呢?下面让我们来探讨下。浏览器的渲染机制首先渲染的一个主流程是如下图:解析html过程...

2019-05-22 19:21:06 155

原创 JS基础(一)数据

一、数据类型任何编程语言都少不了数据类型,javascript的数据类型包含基本数据类型和引用数据类型基本数据类型:string,number,bool,undefined,null,symbol引用数据类型:object(function,Array,Date,RegExp...)不同点:1、基本数据类型是存在栈内存中,按值传递,例:var a = 3,var b = a; b ...

2019-05-17 19:11:48 280

原创 javascript面向对象编程之继承

面向对象编程,少不了继承,js的es5的继承基础就是利用的原型,上面一篇文章已经理解了原型,现在来分析继承方式。一、原型链继承function Animal(type) { this.type = type;}Animal.prototype.colors = ['green','white','red']Animal.prototype.toString ...

2019-03-27 19:39:40 249

原创 javascript面向对象编程之理解原型

我们知道面向对象的三大基本特征:封装、继承、多态,JavaScript的面向对象编程也不外呼围绕这三个特征来学习,js没有类是利用构造函数的原型来达到面向对象编程的效果。因此第一篇来理解原型。1、构造函数和普通函数有什么区别呢?(1)普通函数 function animal(name) { var subname = name console.l...

2019-03-25 18:37:41 190

转载 前端常用的命名规范

推荐网址:https://juejin.im/post/5b6ad6b0e51d4519171766e2

2018-09-27 20:39:45 978

原创 Canvas  绘图  --图形绘制

     Canvas,是屏幕上一个由JavaScript控制的即时模式位图区域,即时模式是指在画布上呈现像素的方式,canvas通过JavaScript调用canvas API,在每一帧中完全重绘屏幕上的位图。我们所要做的就是在每一帧渲染之前设置屏幕的显示内容,这样才能显示正确的像素。下面总结了几种常绘制的图形var canvas = document.getElementById("can...

2018-08-28 11:29:33 365

转载 详解 Javascript十大常用设计模式

转载自:https://juejin.im/entry/58c280b1da2f600d8725b887一:理解工厂模式   工厂模式类似于现实生活中的工厂可以产生大量相似的商品,去做同样的事情,实现同样的效果;这时候需要使用工厂模式。   简单的工厂模式可以理解为解决多个相似的问题;这也是她的优点;比如如下代码: function CreatePerson(name,age,sex) { ...

2018-06-21 17:39:11 27162 4

转载 关于团队合作的css命名规范

转载自AlloyTeam:http://www.alloyteam.com/2011/10/css-on-team-naming/关于团队合作的css命名规范常用的css命名规则:头:header内容:content/container尾:footer导航:nav侧栏:sidebar栏目:column页面外围控制整体布局宽度:wrapper左右中:left right center登录条:logi...

2018-06-20 18:50:11 305

原创 使用 request 与 cheerio、promise完成微博爬虫

最近写了一个微博爬虫,参考了https://www.jianshu.com/p/b53481416b2d1、  首先在nodejs窗口模拟登录2、  分页爬取微博上明星照片3、  将爬取的照片存储到项目的image中具体代码:https://download.csdn.net/download/song_mou_xia/10488949...

2018-06-20 18:07:27 557

原创 通过vue的trasition浅谈css3的动画

vue提供transition来为元素和组件添加过渡过程,主要可以用于以下几部分:(1)条件渲染v-if(2)条件展示v-show(3)动态组件、组件根节点使用方法:1、在单个元素中使用&lt;transition&gt;&lt;div&gt;&lt;/div&gt;&lt;/transition&gt;2、多个元素中使用&lt;transition-group&gt;&lt;div&gt;&lt...

2018-03-21 19:16:56 3188

原创 call,apply 和 bind 的对比分析

一、共同点都能改变函数的执行的上下文,就是函数里this指向的对象1、  call ,apply,bindcall和apply都是用来调用函数的,例如:var isOn=true;var lightBulb={          toggle:function(){                  console.log(this.isOn);

2017-03-17 10:22:44 357

转载 学习 Node.js 的 6 个步骤

转载自https://cnodejs.org/topic/535376501969a7b22aca6d24从刚接触Node.js到现在,自己也是一路摸滚打爬过来的,虽不说是什么高手,但对于如何学习Node.js,还是有一些个人见解,拿出来与大家共勉~学习Node.js大致有 6 个步骤或者说 6 个层次:第一步对于刚接触Node.js的新手来说,第一步无

2017-03-11 16:11:37 291

原创 常见的响应式布局(一)

全球手机浏览的使用量逐渐上升,IE6的使用逐渐下降,越来越多的人使用小屏幕设备上网,而不同屏幕的手机,pad视口的大小不一样,所以像pc端固定min-width的960px不能在移动端适应,所以一般都会用到响应式布局,我总结了一下经常用到的响应式布局.一、flex弹性布局    .contain{padding-right:15px; padding-left:15p

2016-10-10 10:57:23 886

原创 初探Vue原理之view-model的数据动态双向绑定

Vue应用的是mvvm框架,view和model分离,然后通过vm双向数据绑定,`<!-- 模板 --><div id="app"> {{msg}}</div><!-模型->// 原生对象即数据var data = { msg: 'hello!'}// 创建一个 ViewModel 实例var vm = new Vue({ // 选择目标元素 el:

2016-07-11 19:37:31 11225

原创 angular---常用指令总结

布尔属性指令:ng-disabled可以把disabled属性绑定到以下表单输入字段上:input,textarea,select,button       Abutton 当!someProperty=true时,button就被禁用ng-readonly,Ng-selected的用法如上。 类布尔属性指令:ng-href,动态创建URL时,用ng-href代

2016-05-06 19:41:41 1208

原创 Express-jade-stylus框架web开发

s是nodejs的 web应用框架,提供了一系列强大特性帮助创建各种web应用,丰富http工具,使用Express可以快速搭建一个完整功能的网站。Jade是一种高性能简洁易懂的模板引擎,在服务端机客户端都支持,官方的文档http://jade-lang.com/reference/Stylus与less,sass都是一种css动态式语言,可以定义变量,嵌套选择器,混合,条件等语法。

2016-04-04 20:46:25 1142

原创 javascript继承机制综述

继承是面向对象开发的不可或缺的特点,javascript没有像java类似的类,主要应用的是原型对象来实现继承,学习总结了如下几种继承模式。 一、 原型链继承 上节知道每个构造函数都有一个原型对象,原型对象都包含一个指向构造函数的指针,实例都包含一个指向原型的内部指针。那么让一个原型对象等于另一个类型的实例,此时的原型对象就包含了一个指向另一个原型的指针,而另一个原型对象又包含着一个指向另一个的

2016-03-16 18:03:26 492

原创 js面向对象二--封装

Javascript是基于对象的开发语言,遇到的所有复杂的东西都是对象,而面向对象开发语言的最主要特点就是:封装,继承,多态;本文从这三个点学习javascript的面向对象开发。 一、 封装 在程序开发中,我们经常会遇到各种各样的实例,例如:猫,狗,兔子然后在操作这些实例时是很浪费时间空间的,所以在开发中我们经常会抽象成一个对象存储,在具体应用时然后实例化成具体对象。它们都属于动物,我们可以

2016-03-15 20:43:07 393

转载 根据jquery解密js事件委托机制

Javascript一个重要特点就是事件驱动模型,javascript和HTML之间的交互是通过事件是实现的,事件就是文档或浏览器窗口发生的一些特定的交互瞬间,可以使用事件处理程序来预定事件,以便事件发生时执行相应的代码。事件流描述的就是从页面接受事件的顺序,ie的事件流是事件冒泡流,w3c是捕获事件流,由于老版本的浏览器不支持,因此很少用事件捕获。DOM事件流包括三个阶段:事件捕获阶段,处于目标

2016-03-11 15:54:30 1122

原创 Javascript之this对象初解

在面向对象的程序开发中,this通常指的是当面的对象,在javascript里,this对象是在运行时基于函数环境绑定的。所以this的值也是动态的,this指向当前函数的所有者对象,在运行时才能确定具体的指向,本文从this应用的几种场景分析this的指向问题。   场景一:全局函数情况下,函数声明var name="honey";function compare(value1,val

2016-03-09 22:03:34 375

原创 解析css3属性——动画

Css3的动画属性主要有transition(过度)和动画(animation)一、属性解析Transition下的属性,支持的浏览器有Internet Explorer 10、Firefox、Chrome 以及 Opera。属性可以省略一起写,也可以分开申明属性值;例如:1、-webkit-transition:width 2s…     2、 -webkit-transit

2016-03-06 19:46:04 662

原创 Web前端数据存储—cookie机制

HTTPCookie,通常叫做cookie,是用于客户端存储会话信息的。例如平常我们使用的浏览器保存某个网页的登陆用户名,是浏览器提供的一种机制,交由javascript处理cookie,即BOM的document.cookie属性;   Cookie在性质上是绑定在特定的域名下,当设定一个cookie后,再给创建它的域名发送请求时,都会包含这个cookie。这个限制确保cookie只能让

2016-03-05 16:05:29 6245 4

原创 javascript中对象总结

对象Object:普通对象定义方式:1、new操作符  Var person=new Object();Person.name=”jhon”;Person.age=22;2、对象字面量Var person={name:’jhon’,age:22} 数组对象Array   定义方式:2种,    1、 Var colors=newArray(20)  var

2016-03-01 20:13:32 352

原创 web前端开发调试工具--从火狐到谷歌

随着前端技术的发展,css,html,javascript不断的改进和发展,前端代码复杂化也需要很好的调试工具,每个浏览器机会都有开发者工具,可以用来调试代码,按F12就能进入调试界面。本文主要探讨的是火狐的firbug和谷歌的开发者工具。火狐:谷歌:        相同的调试功能:            1、HTML和Elements都是查看dom树结构,

2016-02-27 15:07:46 4355 1

原创 git 快速学习笔记

一、安装个git  根据操作系统下载不同版本的git软件,用的是windows操作系统,所以下载windows版本的,百度安装教程,按步骤安装:http://jingyan.baidu.com/article/90895e0fb3495f64ed6b0b50.html安装成功后,在开始菜单的程序里会看到git程序,打开git bash命令框就可以输入命令操作git。二、基本使用

2016-02-16 17:21:12 405 1

原创 浅谈sql server中约束之主键,外键

约束:顾名思义就是一种限制,在列或表的层次设置约束,确保数据符合某种数据完整性规则Sql server是关系数据库,则在"关联"数据概念上构建的.  例如:设计2个表中的字段关联时,即建立关系时必须先设置主键,否则跳出这样的错误:所以先设置主键,然后建立关系Recharge_Info中的cardNo就是外键 从这个实例中可知:主键的作用:1.唯一性标识

2012-09-14 20:33:29 1295 2

原创 学生管理系统的总结

首先画了一个图,是整个系统的工作过程:系统用到的主要关于数据库的语句:查询语句:"select * from 表 where  字段名='"&text1.text&"'"  删除语句:1."delete from 表名 where 字段名 = '" & Trim(text1.Text) & "'"                   2.recordset.delect

2012-08-24 14:43:23 1708 2

原创 学生管理系统——15天的日志

开始接触学生管理系统是8月9号,今天是8月23号.刚好15天,基本算完成了.就总结了一下这15天的经历和过程.因为自己用了番茄学习法,所以都有相应的记录,然后就把每天的记录总结了一下!       第一天:看了一天学生管理系统的要求并且看了一小短视频的简介.然后安装数据库sqlserver2000,在这期间出了点  小问题:关于连接问题的,首先我             用的是2000的,查询

2012-08-24 09:52:30 5005 2

原创 Recordset中不容小觑的游标

刚接触ado时,没有感觉到游标有什么作用,所以没有怎么关注它,但是做学生管理系统时遇到了一个问题就是我使用recordset标签属性Bookmark总是会弹出:花了一会时间终于找到了解决办法:打开记录集的时候就会涉及到游标例如:   dim   Rs  as   ADODB. Recordset  dim   cnn    as    ADODB.Connection

2012-08-21 21:34:02 2054 1

原创 SQL server2000的初级操作

一:理解数据库   一:理解数据库        之前也做过总结,但至今天为止,又产生了一个新的架构: 二:SQL server2000查询分析器连接        因为我刚开始安的SQL server2008有点问题,所以在开始做学生管理系统之前又安装了SQL server2000,之前没有操作,只是去看了视频,也是刚装的,所以在这个过程遇到了问题:1.查询分析器连接错误

2012-08-17 11:26:33 995 4

原创 连接数据库和vb的ADO的通常使用

通过敲那5个例子,就发现那五个例子全是关于数据库和vb的连接——通过ado实现的,所以就总结了一下ado的通常使用:首先是ado'包括的常用知识:下面是对常用的三个对象的举例说明:Connection:连接,打开数据库例:打开连接数据库Dim  objCn  as new  connectionDim  strCn  as stringstrCn=”provid

2012-08-09 08:32:19 920 7

原创 ADO常用方法——Append

功能:将对象追加到集合中,如果集合是fields,可以先创建field对象然后再将其追加到集合中  格式:1.collection.append object                Collection:集合对象               Object:对象变量,代表所要追加的对象                例:                      Dim

2012-08-08 20:59:07 5071 7

基于nodejs的微博爬虫

使用 request 与 cheerio、promise完成微博爬虫 最近写了一个微博爬虫,参考了 1、 首先在nodejs窗口模拟登录 2、 分页爬取微博上明星照片 3、 将爬取的照片存储到本地

2018-06-20

酷炫的导航栏

用jquery和css3完成的超酷炫的导航栏

2017-08-09

nginx代理转发

前端开发配置的前端服务器

2017-07-25

webpack前端配置案例

复杂的webpack配置,可以参考的完整案例

2017-07-24

空空如也

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

TA关注的人

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