- 博客(54)
- 资源 (1)
- 收藏
- 关注
RSS订阅转载 AngularJS 中的Promise --- $q服务详解
阅读目录 什么是Promise q服务先说说什么是Promise，什么是q服务 先说说什么是Promise，什么是q吧。Promise是一种异步处理模式，有很多的实现方式，比如著名的Kris Kwal’s Q还有JQuery的Deffered。回到顶部 什么是Promise以前了解过Ajax的都能体会到回调的痛苦，同步的代码很容易调试，但是异步回调的代码，会让开发者陷入泥潭，无法跟踪，比如
2016-03-15 11:22:04
642
转载 Promise学习记录（一）
前言 在网站开发中，会经常处理各种事件，如mouseclick/mouseover/click等等。在DOM 0事件模型，采取的事件监听方式是ele.onclick=handler，这会导致一个问题，如果想用hanlder2来监听click，则hanlder就会被覆盖，不会执行了，因为一次只能安排一个监听函数。但在DOM 2事件模型中，使用DOM方法中的addEventListener来添加事件监
2016-03-15 10:48:03
515
原创 原生js实现ajax
function ajax(url,fns,fnf){ /*if(window.XMLHttpRequest){ var oAjax=new XMLHttpRequest(); } else { var oAjax=new ActiveXObject("Micros
2016-02-25 16:23:48
417
转载 Javascript异步编程的4种方法
你可能知道，Javascript语言的执行环境是"单线程"（single thread）。所谓"单线程"，就是指一次只能完成一件任务。如果有多个任务，就必须排队，前面一个任务完成，再执行后面一个任务，以此类推。这种模式的好处是实现起来比较简单，执行环境相对单纯；坏处是只要有一个任务耗时很长，后面的任务都必须排队等着，会拖延整个程序的执行。常见的浏览器无响应（假死），往往就是
2015-12-22 10:41:29
423
转载 《精通CSS》阅读备忘
选择器的层叠和特殊性对于同一个元素，可能会有多个规则，为了解决规则之间的冲突，CSS 会利用 层叠 给每个规则分配一个重要度：1、标有 !important 的用户样式2、标有 !important 的作者样式3、作者样式4、用户样式5、浏览器/用户代理应用的样式层叠优先级依次降低，优先级相同的规则，后定义的规则优先。为了计算规则的特殊性，可以给每种选择
2015-11-28 22:08:12
362
原创 关于window.onload()的加载问题
<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body> <div id="links" onmouseover = "change()">svdr</div></body><script> window.onload =
2015-11-20 17:22:01
2491
转载 JavaScript 的性能优化：加载和执行
随着 Web2.0 技术的不断推广，越来越多的应用使用 JavaScript 技术在客户端进行处理，从而使 JavaScript 在浏览器中的性能成为开发者所面临的最重要的可用性问题。而这个问题又因 JavaScript 的阻塞特性变的复杂，也就是说当浏览器在执行 JavaScript 代码时，不能同时做其他任何事情。本文详细介绍了如何正确的加载和执行 JavaScript 代码，从而提高其在
2015-11-20 16:44:01
664
转载 2015年需要了解的前端框架和语言
2015年需要了解的前端框架和语言语言/平台Node.js第一，PHP第二，JavaScript第三。因为Node.js的社区很多，所以这个结果你也不用太意外。如果你知道JavaScript,你已经一只脚踏进了用Node.js来构建Web APP的可能。框架AngularJS处于框架的领导地位。大量的公司和企业已经采用Angular,这就要求开发
2015-11-14 11:12:28
792
转载 前端构建工具gulp入门教程
本文假设你之前没有用过任何任务脚本（task runner）和命令行工具，一步步教你上手Gulp。不要怕，它其实很简单，我会分为五步向你介绍gulp并帮助你完成一些惊人的事情。那就直接开始吧。第一步：安装Node首先，最基本也最重要的是，我们需要搭建node环境。访问http://nodejs.org，然后点击大大的绿色的install按钮，下载完成后直接运行程序，就一切准备就绪。
2015-11-13 11:12:54
595
转载 响应式布局这件小事
讲到响应式布局，相信大家都有一定的了解，响应式布局是今年很流行的一个设计理念，随着移动互联网的盛行，为解决如今各式各样的浏览器分辨率以及不同移动设备的显示效果，设计师提出了响应式布局的设计方案。今天就和大家来讲讲响应式布局这件小事，包含什么是响应式布局、响应式布局的优点和缺点以及响应式布局该怎么设计（通过CSS3 Media Query实现响应布局）。一、什么是响应式布局?
2015-11-13 10:12:08
310
转载 Javascript模块化编程（三）：require.js的用法
这个系列的第一部分和第二部分，介绍了Javascript模块原型和理论概念，今天介绍如何将它们用于实战。我采用的是一个非常流行的库require.js。一、为什么要用require.js？最早的时候，所有Javascript代码都写在一个文件里面，只要加载这一个文件就够了。后来，代码越来越多，一个文件不够了，必须分成多个文件，依次加载。下面的网页代码，相信很多人都见
2015-11-09 10:53:00
363
转载 Javascript模块化编程（二）：AMD规范
这个系列的第一部分介绍了Javascript模块的基本写法，今天介绍如何规范地使用模块。（接上文）七、模块的规范先想一想，为什么模块很重要？因为有了模块，我们就可以更方便地使用别人的代码，想要什么功能，就加载什么模块。但是，这样做有一个前提，那就是大家必须以同样的方式编写模块，否则你有你的写法，我有我的写法，岂不是乱了套！考虑到Javascript模
2015-11-09 10:50:50
284
转载 Javascript模块化编程（一）：模块的写法
随着网站逐渐变成"互联网应用程序"，嵌入网页的Javascript代码越来越庞大，越来越复杂。网页越来越像桌面程序，需要一个团队分工协作、进度管理、单元测试等等......开发者不得不使用软件工程的方法，管理网页的业务逻辑。Javascript模块化编程，已经成为一个迫切的需求。理想情况下，开发者只需要实现核心的业务逻辑，其他都可以加载别人已经写好的
2015-11-09 10:45:54
298
转载 SASS用法指南
学过CSS的人都知道，它不是一种编程语言。你可以用它开发网页样式，但是没法用它编程。也就是说，CSS基本上是设计师的工具，不是程序员的工具。在程序员眼里，CSS是一件很麻烦的东西。它没有变量，也没有条件语句，只是一行行单纯的描述，写起来相当费事。很自然地，有人就开始为CSS加入编程元素，这被叫做"CSS预处理器"（css preprocessor）。它的基本思想是，用一种专
2015-10-30 21:20:09
292
原创 javascript性能优化
javascript性能优化一、DOM1、减少访问DOM的次数，把运算量尽量留在ECMAscript端处理（因为访问dom的次数越多，代码运行速度越慢）；2、HTML集合它是包含了dom节点引用的类数组对象（没有数组对象特有的方法：eg：push()、slice()等，但提供了类似数组的length属性，同时也能以数字索引的方式访问列表中元素） document.getElem
2015-10-30 17:17:40
323
转载 提升JavaScript递归效率：Memoization技术详解
递归是拖慢脚本运行速度的大敌之一，太多的递归会让浏览器变得越来越慢直到死掉或者莫名其妙的突然自动退出。这里我们可以通过memoization技术来替代函数中太多的递归调用，提升JavaScript效率。递归是拖慢脚本运行速度的大敌之一。太多的递归会让浏览器变得越来越慢直到死掉或者莫名其妙的突然自动退出，所以我们一定要解决在JavaScript中出现的这一系列性能问题。我们可以通过memoi
2015-10-30 16:22:34
352
转载 浏览器的重绘与重排
在项目的交互或视觉评审中，前端同学常常会对一些交互效果质疑，提出这样做不好那样做不好。主要原因是这些效果通常会产生一系列的浏览器重绘(redraw)和重排(reflow)，需要付出高昂的性能代价。那么，什么是浏览器的重绘和重排呢？二者何时发生以及如何权衡？如何在具体的开发过程中将重绘和重排引发的性能问题考虑进去？本文期待可以部分解释以上三个问题。 浏览器从下载文档到显示页面的过程是个复杂的过
2015-10-30 14:11:59
292
转载 seajs学习（7）----文本插件
Sea.js 支持丰富的插件，可用来实现各种功能。下面是文件插件的使用说明。加载模板字符串在 JavaScript 中嵌入 HTML 模板很不方便，特别是当模板内容有多行时。有了 Sea.js, 一切迎刃而解。首先，使用 seajs.config 配置文本插件：seajs.config({ plugins: ['text']});接下来，就可以直接通过 re
2015-10-22 09:52:32
356
转载 seajs学习（6）----配置
可以对 Sea.js 进行配置，让开发、调试更方便。seajs.config seajs.config(options)用来进行配置的方法。seajs.config({// 别名配置alias: {'es5-safe': 'gallery/es5-safe/0.9.3/es5-safe','json': 'gallery/json/1.0.2/json',
2015-10-22 09:50:55
294
转载 seajs学些（5）----模块的加载启动
seajs学些（5）----模块的加载启动Sea.js 是一个模块加载器，模块加载器需要实现两个基本功能：实现模块定义规范，这是模块系统的基础。模块系统的启动与运行。模块定义规范的实现这就是 define，require，exports，module 的实现。具体实现细节，有兴趣的可以看 Sea.js 的源码：seajs/src。可以按照Gruntfile.js 中
2015-10-22 09:49:35
327
转载 seajs学习（4）----require 书写约定
seajs学习（4）----require 书写约定1. 正确拼写模块 factory 构造方法的第一个参数 必须 命名为 require 。// 错误！define(function(req) { // ...});// 正确！define(function(require) { // ...});2. 不要修改不要重命名 require 函
2015-10-22 09:48:25
320
转载 seajs学习（3）----模块标识
模块标识是一个字符串，用来标识模块。在 require、 require.async 等加载函数中，第一个参数都是模块标识。Sea.js 中的模块标识是 CommonJS 模块标识 的超集:一个模块标识由斜线（/）分隔的多项组成。每一项必须是小驼峰字符串、 . 或 .. 。模块标识可以不包含文件后缀名，比如 .js 。模块标识可以是 相对 或 顶级 标识。如果第一项是 . 或
2015-10-22 09:45:41
339
转载 seajs学习（2）----CMD 模块定义规范
在 Sea.js 中，所有 JavaScript 模块都遵循 CMD（Common Module Definition） 模块定义规范。该规范明确了模块的基本书写格式和基本交互规则。在 CMD 规范中，一个模块就是一个文件。代码的书写格式如下：define(factory);define Functiondefine 是一个全局函数，用来定义模块。define d
2015-10-22 09:44:21
461
转载 seajs学习（1）----什么是系统
在生活和工作中，我们会接触到大量系统：自然界生态系统、计算机操作系统、软件办公系统，还有教育系统、金融系统、网络系统、理论系统等等。究竟什么是系统呢？来看下维基百科的解释：系统泛指由一群有关连的个体组成，根据预先编排好的规则工作，能完成个别元件不能单独完成的工作的群体。系统分为自然系统与人为系统两大类。简言之，系统有两个基本特性：系统由个体组成。个体之间有关连，按照规则
2015-10-22 09:42:31
291
转载 什么鬼，又不知道怎么命名class了
作者：结一 日期：2015-10-19 点击：8千重重构CSS相信写css的人都会遇到下面的问题：糟糕，怎么命名这个class，好像不太贴切，要是冲突了怎么办，要不要设计成通用一点...而改别人css代码的时候则会一直有个疑问：这个class到底是只在这个地方用了，还是其他地方都用了？于是就有了下面
2015-10-20 18:34:41
750
原创 通过className获取元素的js
//只适用于获取只有一个class名的元素function getByClassName (oParent, subClass) { var aElements = document.getElemntByTagName('*'); var arr = []; for(var i = 0;i if(aElements[i].classNam
2015-10-20 09:36:11
700
原创 jQuery基础
1、对象的实例化：①使用new关键字eg://构造函数function Create(age){ this.age=age;}var firstPerson = new Create(16);②使用对象字面量(注：在属性列表的最后一个值的末尾，不要使用结尾逗号)eg:var firstObject = { };var obj1 = obj2 = { };/
2015-10-07 13:26:46
307
原创 代码语义化
一、创建良好的标记（代码语义化）（1）中的内容可以明显的提高页面在搜索引擎中的排名注意：根据文档内容的结构而选择html元素，而不是根据html元素的样式（2）避免过度使用div和span，但并不意味着避免使用div和span，几个合理位置中的div可以让文档显得井井有序。（3）css布局存在一个常见的问题：FOUC（无样式内容瞬间，Flash of Unstyled Conten
2015-09-24 09:18:35
864
原创 css的position属性值
CSS样式表中的position属性详细说明点评：CSS position属性使用说明，需要的朋友可以参考下。在CSS中关于position定位的内容是：position: relative | absolute | static | fixedstatic(静态) 没有特别的设定，遵循基本的定位规定，不能通过z-index进行层次分级。relative(相对定位) 对
2015-09-09 21:30:23
517
原创 table布局的优缺点与id与class的区别
一、table布局的优缺点：Table的缺点1、Table要比其它html标记占更多的字节。(延迟下载时间，占用服务器更多的流量资源。)2、Tablle会阻挡浏览器渲染引擎的渲染顺序。(会延迟页面的生成速度，让用户等待更久的时间。)3、Table里显示图片时需要你把单个、有逻辑性的图片切成多个图。(增加设计的复杂度，增加页面加载时间，增加HTTP会话数。)4、在
2015-09-06 18:21:38
2499
原创 解决本地项目上传到github时$git push -u origin master error failed to push some refs...等错误
使用命令：1、touch README.md2、git init3、git add .4、git commit -m "test"5、git remote add origin master6.git push -u origin master(执行这个命令行后会弹出下面的错误，出现错误的主要原因是github中的README.md文件不在本地代码目录中)7、可
2015-08-28 14:31:59
6838
原创 有方向的运动js
derective sport #eyes{width:200px;height:300px;position: absolute;left:500px;top:200px;text-align: center;background:url(../images/eye.png) no-repeat;} #leye{border:2px solid b
2015-08-19 11:35:43
748
转载 Git Gui for Windows的建库、克隆（clone）、上传（push）、下载（pull）、合并
摘自：http://hi.baidu.com/mvp_xuan/blog/item/2ba062d8cd2c9fc939012fae.html 关于linux上建库等操作请看文章： http://hi.baidu.com/mvp_xuan/blog/item/30f5b700a832f0261d9583ad.html http://hi.baidu.com/
2015-08-19 00:23:55
294
原创 圆周运动js
circlar movement #circle{width:30px;height:30px;position: absolute;background-color: lightgreen;left:600px;top:250px;border-radius: 50%;} window.onload=function(){
2015-08-18 17:07:51
1065
原创 滑动菜单
appleMenu body{margin:0px auto;padding:0px auto;} #menuBar{width:100%;height:70px;position:absolute;bottom:0px;text-align: center;} #menuBar img{width:70px;height:70px
2015-08-17 16:21:24
691
原创 原生js螺旋运动
window.onload=function(){var oSpiral=document.getElementById('spiral');var oUl=oSpiral.getElementsByTagName('ul')[0];var aLi=oUl.getElementsByTagName('li');var size=6;var len=size*size;var
2015-08-14 16:33:03
1358
原创 碰撞运动js
window.onload=function(){var oCrash=document.getElementById('crash');var speedX=5;var speedY=5;startCrash();function startCrash(){setInterval(function(){var X=oCrash.offsetLeft+speed
2015-08-07 14:28:24
783
原创 javascript
/*js不产生冲突，需要避免全局变量的泛滥，合理使用命名空间以及为代码添加必要的注释（可以提高代码的可维护性）*/window.onload=function(){var Global={};Global.nameSpace=function(str){var arr=str.split('.');var o=Global;for(var i=(arr[0]='Global
2015-08-06 10:53:44
336
原创 css
CSS的注意事项1.模块最好不要混用margin-top和margin-bottom，统一使用margin-top或margin-bottom，因为相邻的模块同时使用margin-top和margin-bottom会造成边距的重合，从而带来不必要的麻烦。2当不同选择符的样式设置有冲突时.会采用权重高的选择符设置样式（html标签的权重：1, class：10, id：100， ）；如果cs
2015-08-05 11:06:32
374
原创 js简单运动
movement#imgShow{width: 100px;height: 100px;overflow:hidden;position:relative;}#preview{position: absolute;width:100px;height: 100px;background-color: red;}Web Design
2015-07-24 18:39:00
302
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人