2017年08月_zuiziyoudexiao

翻译 sass的安装

首先到ruby官网http://rubyinstaller.org/downloads安装ruby。安装过程中请注意勾选Add Ruby executables to your PATH添加到系统环境变量。运行CMD输入以下命令：ruby -v，检测是否安装成功，若安装成功会打印相关版本信息。如：ruby 2.3.3p222 (2016-11-21 revision 56859) [x64-mi

2017-08-21 17:13:43 510

翻译 sass混合器，选择器的继承

sass混合器混合器使用@mixin标识符定义。这个标识符给一大段样式赋予一个名字，这样你就可以轻易地通过引用这个名字重用这段样式。功能类似于编程语言的函数。 - 通过@include来使用这个混合器，放在你希望的任何地方。@include调用会把混合器中的所有样式提取出来放在@include被调用的地方。//定义混合器@mixin rounded-corners { -moz-border

2017-08-20 22:47:55 1267

翻译 sass文件的导入

css有一个特别不常用的特性，即@import规则，它允许在一个css文件中导入其他css文件。然而，后果是只有执行到@import时，浏览器才会去下载其他css文件，这导致页面加载起来特别慢。sass也有一个@import规则，但不同的是，sass的@import规则在生成css文件时就把相关文件导入进来。另外，所有在被导入文件中定义的变量和混合器均可在导入文件中使用。使用SASS部分文件;

2017-08-20 17:34:14 9098

原创 sass嵌套CSS 规则;

css中重复写选择器是非常恼人的。但在Sass中，你可以在规则块中嵌套规则块。如：#content { article { h1 { color: #333 } p { margin-bottom: 1.4em } } aside { background-color: #EEE }} /* 编译后 */#content article h1 { color: #

2017-08-20 16:54:38 5297 1

原创 sass中变量的使用

什么是 CSS 预处理器？CSS 预处理器定义了一种新的语言，其基本思想是，用一种专门的编程语言，为 CSS 增加了一些编程的特性，将 CSS 作为目标生成文件，然后开发者就只要使用这种语言进行编码工作。什么是sassSass 是一门高于 CSS 的元语言，它能用来清晰地、结构化地描述文件样式，有着比普通 CSS 更加强大的功能。变量的使用sass为css引入了变量。你可以把反复使用的cs

2017-08-20 15:39:01 1504

原创 springboot aop

网络包括电信网络，有线电视网络，计算机网络。网络把许多计算机连接在一起，因特网把许多网络连接在一起。多层次ISP结构的因特网，ISP称为因特网服务提供商，ISP拥有申请到的多个IP地址，任何机构和个人都可通过IP地址接入因特网。第一层 ISP为最高级别服务范围最大，第二层ISP主要为一些大公司，第三层ISP用户为校园网，企业网以及拨号上网的用户。一旦某个用户接入到互联

2017-08-20 14:50:51 599

翻译 HTTP协议

HTTP协议工作于客户端-服务端架构为上。浏览器作为HTTP客户端通过URL向HTTP服务端即WEB服务器发送所有请求。Web服务器根据接收到的请求后，向客户端发送响应信息。HTTP协议通信流程： HTTP三点注意事项 HTTP是无连接：限制每次连接只处理一个请求。服务器处理完客户的请求，并收到客户的应答后，即断开连接。 HTTP是媒体独立的：只要客户端和服务器知道如何处理的数据内容，

2017-08-20 02:15:33 311

翻译 web页面渲染解析原理

浏览器渲染页面的原理用户输入网址（假设是个html页面，并且是第一次访问），浏览器向服务器发出请求，服务器返回html文件然后浏览器从head标签开始逐行解析HTML代码，遇到link标签又会向服务器请求加载css文件，不过这个过程是异步的，有多个css文件，会多个同时加载。继续往后如果遇到script标签或者js文件就会立即执行它，而且js文件的加载是同步的。到了body标签就开始渲染页面

2017-08-14 23:13:28 3297

原创 js函数声明与赋值详解

直接声明函数a();function a(){ alert('...');}//函数的声明会优先读取，无论函数的执行语句放在声明前面还是后面都会正常执行表达式方法定义函数var a = function(){ alert('...');}a();//函数的定义不会优先加载，函数的执行语句必须放在定义的后面，否则会报错。以上两种方法结合起来(会统一按照第二种方法处理)

2017-08-13 14:01:06 5701 2

原创 jQuery操作dom

jQuery常用选择器//基本选择器 $("#myELement") 选择id值等于myElement的元素 $("div") 选择所有的div标签元素组 $(".myClass") 选择使用myClass类的所有元素 $("#myELement,div,.myclass") 并列选择器，进行联合选择//层次选择器$("form input")

2017-08-12 02:49:24 351

原创 js错题集

下面这个JS程序的输出是什么：function Foo() { var i = 0; return function() { console.log(i++); }}var f1 = Foo(), f2 = Foo();f1();f1();f2();答案：010/*（1）Function是引用类型：保存在堆中，变量f1,f2是保存在栈中；

2017-08-12 01:36:30 918

原创由于dom结构的改变导致事件处理程序找不到事件主体报错的解决方法

在编程的过程我们可能给一个dom对象注册了一个事件处理程序，而这个dom对象一开始是不存在的，可能要触发另一个事件才会生成这个dom对象。这时候可能会报错Uncaught TypeError: Cannot set property ‘onclick’ of null找不到事件源如下面这个例子：为一个按钮button注册一个点击事件，点击后执行一条alert语句。但这个按钮一开始不存在。//由于

2017-08-11 18:39:02 304

转载 symbol类型

为了从根本上防止对象中属性名的冲突，ES6 引入了一种新的原始数据类型Symbol，表示独一无二的值。它是 JavaScript 语言的第七种数据类型。是一种类似于字符串的数据类型let s = Symbol();typeof s// "symbol"Symbol 值通过Symbol函数生成。这就是说，对象的属性名现在可以有两种类型，一种是原来就有的字符串，另一种就是新增的 Symbol 类型

2017-08-09 22:37:44 1375

转载 js中的字符串方法总结

charAt方法返回指定索引位置处的字符。如果超出有效范围的索引值返回空字符串。strObj.charAt(index) //例如： var str = "ABC"; str.charAt(1); //结果：B slice方法返回字符串的片段。strObj.slice(start[,end]) //例如： 012345 var str = "ABCDEF"; str.slice(

2017-08-09 22:19:15 247

转载字符串的扩展

传统上，JavaScript只有indexOf方法，可以用来确定一个字符串是否包含在另一个字符串中。ES6又提供了三种新方法。 -includes()：返回布尔值，表示是否找到了参数字符串。 -startsWith()：返回布尔值，表示参数字符串是否在源字符串的头部。 -endsWith()：返回布尔值，表示参数字符串是否在源字符串的尾部。var s = 'Hello world!';s.

2017-08-09 00:23:43 288

转载变量的解构赋值

数组的解构赋值ES6 允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构。本质上，这种写法属于“模式匹配”，只要等号两边的模式相同，左边的变量就会被赋予对应的值。let [a, b, c] = [1, 2, 3];let [foo, [[bar], baz]] = [1, [[2], 3]];foo // 1bar // 2baz // 3let [x, , y] =

2017-08-08 18:36:18 392

转载 ES6顶层对象的属性

顶层对象，在浏览器环境指的是window对象，在Node指的是global对象。ES5之中，顶层对象的属性与全局变量是等价的。window.a = 1;//全局变量a默认为window的属性a // 1a = 2;window.a // 2ES6为了改变这一点，一方面规定，为了保持兼容性，var命令和function命令声明的全局变量，依旧是顶层对象的属性；另一方面规定，let命令、con

2017-08-08 13:11:12 382

转载 ES6中const的使用

const声明一个只读的常量。一旦声明，常量的值就不能改变。且const一旦声明变量，就必须立即初始化，不能留到以后赋值。const的作用域与let命令相同：只在声明所在的块级作用域内有效。const命令声明的常量也是不提升，同样存在暂时性死区，只能在声明的位置后面使用。也与let一样不可重复声明。const实际上保证的，并不是变量的值不得改动，而是变量指向的那个内存地址不得改动。const

2017-08-08 12:56:20 2296

转载 ES6中let与var的区别

通过var定义的变量，作用域是整个封闭函数，是全域的。通过let定义的变量，作用域是在块级或是子块中。for (let i = 0; i < 10; i++) { // ...}console.log(i);// ReferenceError: i is not defined//计数器i只在for循环体内有效，在循环体外引用就会报错。变量提升现象：浏览器在运行代码之前会进行预解析，

2017-08-08 11:44:41 50850 5

原创 git工具常用命令

初始化命令git version 查看git版本信息ls -a 查看当前文件夹下所有文件git init 在当前目录初始化一个git仓库git config --list 查看git的配置信息本地仓库管理git status 查询当前目录下的文件状态git add 文件名把未被追踪的文件添加到暂存区（.表示所有文件）git c

2017-08-06 23:00:30 406

转载 css居中总结

行内元素的水平居中：给父元素设置 text-align：center；但对浮动元素，绝对定位元素无效确定宽度的块级元素的水平居中：设置margin:0 auto;不确定宽度的块级元素的水平居中-将块级元素display设置为inline，然后使用text-align：center-给父元素设置float,position:relative,left:50%,子元素设置position:

2017-08-04 13:39:28 177

原创 node单线程异步，基于事件驱动的理解

在node中绝大多数的操作默认就是以异步的方式进行的。比如：发送一个Ajax请求，在写一个输出语句。$.post('url',{title:'node.js'},function(data){ console.log('收到响应');});console.log('发送请求结束');由于第一步发送Ajax请求需要等待，所以执行到第一步会默认另外开辟空间去执行这个请求，然后立即执行第二步

2017-08-01 15:23:57 486

原创 node连接数据库

直连mysql直连mysql用的比较少，这里直接放个例子：var mysql = require('mysql');//连接数据库var connection = mysql.createConnection({ host:'localhost', user:'root', //用户名 password:'', //密码 database:'study'

2017-08-01 00:58:37 2280

最自由的笑的博客