baie2621-CSDN博客

转载 gulp实用配置（2）——中小项目

上一篇的gulp配置很简单，主要就是为了demo的查看和调试，这一篇则会相对详细一些，包括压缩合并打时间戳等。在互联网环境比较好的城市，需要多人协作的，大一点的项目应该都用上了模块化（这里主要指commonjs和ES6模块系统，不是再早的require.js和sea.js）。代码也会更注重如何分离和注入，而不再是单纯的合并。但是在很多小公司，开发模式或技术都还是比较传统的，或者一...

2017-07-09 16:49:00 124

转载 gulp实用配置（1）——demo

在React和Vue推进下，现在很多人都在使用webpack作为自动化构建工具，但其实在很多时候我们并不是一定需要用到它，gulp这样的轻量级构建工具就足够了。最近一段时间不是太忙，所以就写了三份配置，用在不同的情况下。这篇文章介绍第一份配置，也是最简单的一份。这份配置我把它称作demo测试配置，因为在我工作的时候，经常需要快速出效果或者实现某些功能，你没有时间去自己实现，那...

2017-07-06 17:53:00 136

转载使用base64提升视觉效果体验

最近在做一个微信端的小项目，前端代码写完后，就放在手机端测试，没什么问题，但是页面在加载和渲染时的效果却让人有些不爽，虽然是个小项目，我大可不必做这些，但是看着页面的闪动，就忍不住想做些什么。先说说问题吧：上面是首页效果图，其实在最开始的时候并没有考虑web端，这图是给IOS和安卓native App用的。为了方面两个本地APP的开发，所以上面的图中，除了那几个科目...

2017-07-06 15:30:00 125

转载基于express+mongodb+pug的博客系统——后台篇

上一篇介绍了模板引擎pug.js的用法，这一篇就主要写后台逻辑了。后台的大部分的功能都有了，只是在已经登录的状态下，前台和后台的逻辑处理还不是很完善。先上几张图吧，仿旧版的简书，改了下UI，因为没有简书那么多内容，所以没必要完全做成一样的。 1.项目结构 app.js是整个工程的入口 model文件夹放连接数据库的逻辑 public 文件夹...

2017-05-21 17:48:00 178

转载基于express+mongodb+pug的博客系统——pug篇

很久之前就想自己搭一个博客了，最开始用hexo+github，但是换电脑后总是有些麻烦。后来使用WordPress，但是用WordPress总觉得没什么技术含量，前后端都是人家写好的，而且买的垃圾虚拟机老是出问题，动不动就要提交工单解决，所以最后干脆就直接在博客园上写了。最近比较闲，所以正好抽时间简单看了下node.js，然后看了看express，顺便搭了个博客出来练手。当然也不仅是...

2017-05-14 17:35:00 250

转载 JavaScript之DOM操作（二）

这一篇写写常用并且通用的操作节点的一些方法。 1.节点方法 1>appendChild() 向childNodes列表的末尾添加一个节点，语法var aChild = element.appendChild(aChild); 需要注意的是，如果被传入的节点在文档中已经存在，那结果会将该节点从原来位置移除，然后再添加到指定位置。例： var returnedNode...

2017-03-26 20:19:00 66

转载 JavaScript之DOM操作（一）

这篇文章写于2017-3-19，所有例子基于Chrome 56.0.X。如果时间太久，请自行查阅MDN等获取最新规范内容。 1.节点类型　　从MDN上获取的最新情况　　一共12种节点类型，分别由12个数值常量来表示，不过我们最常用的是元素节点1和文本节点3，也是必须要彻底弄明白的。在这篇文章里，也主要讲解这两种类型的节点。 2.节点属性 1>nodeType...

2017-03-19 18:53:00 74

转载 JavaScript之Array

JavaScript是一门非常灵活的动态语言，涵盖的内容也挺多，《JavaScript高级程序设计》看了也有两遍，但是在实际开发的时候，还是有很多东西记不清，然后还得去翻书，特别是一些Array、String对象之类的操作方法，经常搞混，所以趁着这次再从头学一次JavaScript的机会，把这些操作方法或者技巧都记下来，一来加深印象，二来方便查阅。现在的JavaScript的正式版本...

2017-03-05 22:29:00 105

转载 CSS属性之border

css的border属性相信大家都不陌生了，就是给元素加个边框嘛，在不同的盒模型下，会给元素的宽高带来怎样的影响，相信大家也都很熟悉了，这里就不再赘述，只说说大家平时没有怎么留意的东西。 0.border-color与color 大家平时使用border属性的时候，通常应该是直接写border:1px solid #ccc; 类似于这个样子。不过大家知不知道当不给border设置...

2017-02-25 16:41:00 189

转载 CSS属性之attr()

attr()准确的说，不应该是一个属性，而是一个CSS的函数，我们先看看MDN上的介绍吧： Summary Theattr()CSSfunction is used to retrieve the value of an attribute of the selected element and use it in the style sheet. It can be us...

2017-02-13 17:52:00 548

转载 CSS属性之margin

0.对自身可视宽度的影响 1>改变处于标准文档流中，未设置width值的block元素的可视宽度在标准文档流中，对于没有设置宽度的block元素，当其具有内容或者设置高度后，其自身宽度为父元素宽度的100%，这个时候给block元素设置水平方向的margin值，就会改变元素的可视宽度。但是不能改变高度，因为block元素的高度是固定或者等于其内容的高度，并不会拉伸。这...

2017-02-10 17:39:00 324

转载 CSS属性之padding

0.inline元素中的padding 大家都知道padding对于block元素和inline-block元素的影响，而对于inline元素，padding只会在水平方向产生影响，垂直方向不会产生影响。这么说其实不准确，给inline元素设置垂直方向的padding，不会改变元素的高度，也不会影响其他元素，但是会改变他自身的背景的高度。 <div class="wra...

2017-02-08 14:42:00 112

转载 CSS属性之relative

0.相对定位relative特点相对定位relative元素总是会占据位置，所占据的位置是在relative元素没有设置left/top/right/bottom属性时的位置；相对定位relative元素在设置定位时，不会影响其他元素；相对定位relative元素在设置定位时，是相对于自身的定位 <div class="page"> <div c...

2017-01-28 23:36:00 128

转载 CSS属性之absolute

0.脱离标准文档流绝对定位的元素会脱离标准文档流，拥有z-index属性，并且对于它的任何操作和改变都不会影响它的兄弟元素和父级元素，这里就不过多介绍。不过值得注意的是，虽然绝对定位元素脱离的标准文档流，但是它依然会受到父元素影响哦，比如line-height和text-align属性等。 1.跟随性绝对定位的元素脱离标准文档流之后，并不是跑到了任意的位置，而是跟在前一个没...

2017-01-16 18:30:00 106

转载 css属性之float

0.float与margin 两个相邻的浮动元素，当第一个浮动元素（不论是左浮动还是右浮动）的宽度为100%时，第二个浮动元素会被挤到下面，通过添加负margin-right值（绝对值最少等于它自身的宽度），可以使它回到第一行。在书写html代码时，我们通常的习惯根据UI样式，从左往右来写代码，但有时候右侧的内容比较重要，所以它的html结构需要放在左侧内容上面，让它更早的加载，比...

2017-01-08 22:12:00 78

转载基于Vue2.0的单页面开发方案

　　2016的最后一天，多多少少都应该总结一下这一年的得失，哪里做的好，哪里需要改进，记一笔，或许将来会用到呢。　　毕业差不多半年了，一直是一个人在负责公司项目的前端开发与维护，当时公司希望前后端分离，提高前端的开发效率和后期维护的便捷，所以自己在经过一番调查后，决定采用SPA的模式，其主要原因还是阿里中途岛的那样的东西，我们没办法搞出来。　　项目不需要兼容IE8及以下的浏览器，...

2016-12-31 22:35:00 122

转载灵活的JavaScript（一）

　　自己对JavaScript的原型，继承，闭包，多少也还是了解些，但是平时写的东西都挺简单的，也用不上，所以感觉提升不大。于是乎买了一本《JavaScript设计模式》来提高下自己，这本是百度写的，不是国外的那本，看了第一章，哇靠。。。写的真好，带入感真的强，看小说的朋友应该都懂。　　平时也都会看一些别人的博客之类的，但是平时不怎么用，所以久而久之也就忘记了。这次便打算一边看，一边...

2016-11-15 00:32:00 72

转载菜鸟快飞之JavaScript对象、原型、继承（三）

　　正文之前需要声明的一点是，菜鸟系列博文全是基于ES5的，不考虑ES6甚至更高版本。继承　　由于我个人不是学计算机的，所以对于很多东西只是知其然，不知其所以然。就像这个继承，刚开始学JavaScript就听人说了JavaScript几大核心，但是自己平时似乎都没怎么用到，所以一直不明白为什么需要这些东西，面试还总是问这些。　　但是随着一点点学习，也有去看过jQuery源码，...

2016-02-23 18:58:00 60

转载菜鸟快飞之JavaScript对象、原型、继承（二）

　　上一节写了创建对象的三种方法，而其中通过函数创建对象的方式又有三种模式，分别是工厂模式、构造函数模式、原型模式。而这三种模式最常用的则是原型模式。还是上栗子：　　工厂模式： function Fun1(name,age){ var obj = {}; obj.name = name; obj.age = age; obj.sayNma...

2016-02-14 22:26:00 77

转载菜鸟快飞之JavaScript对象、原型、继承（一）

　　有前辈说过，在JavaScript中，一切皆对象。由此可见，作为JavaScript的核心之一，对象是有多么重要。虽然今天走亲戚有点累，但还是得写写这个对象，免得吃几天好的，就又忘光了。 1.创建对象　　通过内置对象创建： var obj1 = new Object(); typeof obj1; // object var obj2 = new Array();...

2016-02-10 00:09:00 75

转载菜鸟快飞之JavaScript函数

1.复制变量值　　在说函数前，我觉得需要先说说关于变量值的复制，以便后面的理解。　　复制基本类型的值：　　当一个变量复制另外一个值为基本类型的变量时，两个变量可以参与任何操作而不会互相影响 var num1 = 5; var num2 = num1; console.log('num1的值是：' + num1); // 5 console.log('num2的值是...

2016-02-05 00:33:00 92

baie2621的博客