前端小白

原创 Web前端开发热门技术（持续更新）

Polymer        Web Components，Google一直在推进的技术，目的是让开发者可以创建与原生DOM用法一模一样的自定义Components，并增加数据双向绑定，以实现对html的终极扩展。目前已有部分实现。        详情参见：http://www.csdn.net/article/2013-05-27/2815450-google-polymer

原创 JS面试题（持续更新）

1.难度★★★★ function func1() { var n = 0; add = function () { n++; } function func2() { console.log(n); } return func2; }

原创 JS模块化编程

1. 背景　　JS的强大已经不用解释了，从Web RIA到Node服务器，到处都是JS的身影。然而由于出身的缘故，JS本身在大规模应用上存在着很多问题，比如模块化编程。本文以浏览器端模块化编程为内容，重点介绍AMD规范和CMD规范。在服务器端，NodeJS遵守的Common规范我们这里暂不讨论。　　对于计算机语言，模块化编程是必不可少的，对架构设计、代码复用起到至关重要的作用，工程中引入别

原创 用Canvas打造高强度渲染SVG

前言         早就想写这篇博客。一个原因是其中某些内容在某度的面试中遇到，比如第二部分；二是一些需求在实际工程中遇到了。 一、基本概念Canvas：html5新增的DOM，提供了像素级图形编程接口。支持path，不支持鼠标响应，不能绘制矢量图，依赖分辨率，文本渲染能力弱，刷新能力强。适用于图像密集型编程，如游戏。SVG：一种使用XML描述2D图像的语言。因此SVG中所有

转载 Yahoo！前端优化35黄金准则

转自http://www.360doc.com/content/14/0325/14/15727046_363598248.shtmlYahoo!的Exceptional Performance团队为改善Web性能带来最佳实践。他们为此进行了一系列的实验、开发了各种工具、写了大量的文章和博客并在各种会议上参与探讨。最佳实践的核心就是旨在提高网站性能。Excetional Performance

转载 几张简约而不简单的JavaScript学习树状图

原创 CSS display & float详解

一、display属性1．  display属性的作用是规定元素以什么方式渲染。常用的值如下：none：不被渲染block：以块级元素渲染inline：以内联元素渲染inline-block：以行内块渲染inherit：继承父级容器的渲染方式2．  元素渲染类型浏览器对每个html元素有默认的渲染类型，默认为块级元素的主要有：div、form、h1-h6、hr、no

原创 《JavaScript高级程序设计 第三版》学习笔记 （十三）高级函数

一、高级函数1.安全的原生类型检验　　js的原生类型，可以用typeof判断，但有时会失效。比如typeof array返回的不是Array，而是Object；再比如老版本IE，会将function识别为Object。另外一个判断类型的是instanceof，它能够在对象的原型链中查找构造函数，但这种方法对于原生类型的判断也会出问题，因为某些原生构造函数用户是可以覆盖的，比如Arr

原创 《JavaScript高级程序设计 第三版》学习笔记 （十二）Ajax详解

一、JSON1.使用XML在服务器和浏览器之间进行数据交换太浪费带宽，因而出现了新的数据结构JSON。JSON是包含了简单值、对象、数组的严格的JS子集，不支持变量、函数或对象实例。很多语言也有各自的JSON解析器和序列化器。2.不能将JSON写成简单的js字面量，否则只能在js中使用，而其他语言会解析不了。JSON要求严格的地方主要有：字符串值必须用双引号；对象属性必须用双引号；同一个对

原创 《JavaScript高级程序设计 第三版》学习笔记 （十一）事件详解

一、事件流1.事件冒泡：事件开始时由最具体的元素（文档中嵌套层次最深的那个节点）接收，然后逐级向上传播到较为不具体的节点（文档）。最早使用事件冒泡的是IE，现在绝大多数浏览器都使用冒泡。IE9、Firefox、Chrome、Safari都将事件冒泡到window。2.事件捕获：事件捕获是由不太具体的节点先接收事件，而最具体的节点最后接收事件。顺序与事件冒泡刚好相反。IE9、Safari、C

原创 《JavaScript高级程序设计 第三版》学习笔记 （十）DOM详解

一、节点1.节点层次（1）节点是浏览器中的基础类型，所有DOM对象都是特殊的节点，继承自node，可以使用节点自带的方法。（2）可以通过somenode.childNodes[0];somenode.childNodes.item(0);somenode.firstChild;somenode.lastChild迭代当前节点的子节点。（3）可以通过somenode.parentNo

原创 《JavaScript高级程序设计 第三版》学习笔记 （九）BOM详解

一、window对象1.作为Global（1）window有双重身份，一是js访问浏览器的一个接口，二是ECMAScript的Global对象。（2）window作为Global，在全局作用域声明的变量、函数都是window对象的属性和方法。定义全局变量和定义window属性是有区别的：定义的window属性，可以用delete删掉，这和其他对象一致；定义的全局变量则不能。还有一个区别

原创 《JavaScript高级程序设计 第三版》学习笔记 （八）块作用域及私有成员

一、模仿块级作用域1.js不像C和java一样有块级作用域。在C和java中，一对大括号{}决定一个作用域，比如for循环。在js中，变量可以在函数任何一处定义，并且忽略重复定义。变量初始化之前使用，值永远是undefined。这些内容在以前已经提到了。//小实验function count(){b=1;a=1;alert(a);//1for(var a=0;a//

翻译 《JavaScript高级程序设计 第三版》学习笔记 （七） 内存泄漏详解

一、内存泄漏1.所谓内存泄漏，是指浏览器的垃圾回收机制无法正常回收没用的DOM对象，根本原因是DOM对象的引用数大于0。2.在IE9之前的版本，IE浏览器的DOM对象和JS对象使用了不同的垃圾回收机制。这是内存泄漏的根源。3.浏览器回收DOM对象，都是查看DOM对象的引用次数是否为0。而有些时候，某个DOM对象的引用次数永远都不会变为0，哪怕是页面已经关闭了。想让内存发生泄漏，做法就是

原创 《JavaScript高级程序设计 第三版》学习笔记 （六） 函数与闭包详解

2014.8.31一、函数声明1.函数的声明语法：function funcName(){}。js执行前会把函数声明载入，因此可以在调用之后声明函数，不必向c语言一样先声明，再调用，然后写实现。这个学名叫“函数声明提升”。2.函数的表达式语法：var funcName=function(){}。这种方式其实是先创建一个匿名函数，然后把函数的地址传给变量。所以在调用funcNam

原创 《JavaScript高级程序设计 第三版》学习笔记 （五） 继承详解

2014.8.30面向对象语言有两种继承方式：接口继承（只继承方法名）；实现继承（继承实际的方法）。但在ECMAScript中，函数名没多大含义，只是函数体的引用而已，因此，ECMAScript无法实现接口继承，只支持实现继承。实现继承，主要是依靠原型链来完成的。一、原型链1.原型链的基本思想是：利用原型让一个引用类型继承另一个引用类型的属性和方法。2.构造函数、原

原创 《JavaScript高级程序设计 第三版》学习笔记 （四） 对象创建详解

2014.8.29一、对象1.ECMAScript把对象定义为“一组没有特定顺序的值，这些值可以是基本值、对象或函数。”我们可以把js的对象想象成散列表，每个值对应这一个key。每个对象都是基于引用类型创建的，可以是前面提到的原声引用类型，也可以是自定义引用类型。2.一个对象（实例），是它内部所有函数值（方法）的执行环境。3.对象的属性，包括两种，数据属性和访问器属性。

原创 《JavaScript高级程序设计 第三版》学习笔记 （三）引用类型详解

2014.8.28一、引用类型1.ECMAScript从技术上讲是一门面向对象语言，但它不具备传统的面向对象语言所支持的类和接口等基本结构。js中的对象，是某个特定引用类型的实例。新对象通过new操作符构造出来。构造函数本身也是一个普通函数，加new和不加new的运行结果完全不同。ECMAScript有很多原生的引用类型。2.Object类型（1）Object的属性，可以用点语法访问，

原创 《JavaScript高级程序设计 第三版》学习笔记 （二）执行环境与作用域链

一、值和引用1.基础类型值：js中五个基础类型unsigned、null、number、boolean、string，这些类型的变量名代表值；把这些变量当作参数传递给函数，解析器会复制一份形参给函数当局部变量用（注意，字符串也是传的值，和其他语言出入比较大）。2.引用类型值：js的其他类型object、function、array、date(array和date都是object)等，这些类

原创 《JavaScript高级程序设计 第三版》学习笔记 （一）数据类型详解

一、基本概念1.ECMAScript（1）这是一个标准，虽然是伴随js而生的，但不意味着这就是js。这是用来规定语法、类型、关键字之类信息的。（2）ActionScript也使用这个标准。js核心就是把符合这个标准的语句解析执行。2.DOM（document）（1）这不是js的组成部分，而是js的扩展，是经过扩展用于html应用程序变成的API接口，因此，在服务器运行的Node

原创 CSS position详解

1.首先必须说明的，是浏览器渲染DOM的原理。浏览器根据html中的顺序依次渲染，对文字图片等进行分块，一个块接一个块渲染。2.接下来，要说明的是，可以设置块的大小。3.然后看一下position， position属性有四个值，static、relative、absolute、fixed。        A.static：这个值表示默认，让浏览器按照没有positio

转载 CSS 盒子模型

Width和Height是控制DOM的关键，也是造成页面浏览器不兼容的元凶。前端小白往往不注意这些，做出各种不兼容的页面。1.首先，还是来看看奇葩的IE：

原创 CSS 筛选器详解

1.为什么要研究CSS筛选器？因为想在页面中控制一个元素的样式太困难太麻烦了。使用内联CSS基本上宣布了放弃界面的可维护性；使用js修改样式，写不好的话，维护性也等同于零。而CSS样式表是html原生的维护性最好的外挂，好的样式表，可以控制整站样式。更关键的是，jQuery也使用CSS筛选器来抓取DOM引用。因此，CSS筛选器，是前端攻城尸必修课之一。2.什么是筛选器？筛选器，翻译成普通话