前言：javascript里变量作用域是个经常让人头痛抓狂的问题，下面通过10++个题目，对经常遇到又容易出错的情况进行了简单总结，代码样例很短很简单
题目一
JavaScript代码
- var name = 'casper';
- alert(name); //毫无疑问地输出：casper
- var name = 'casper';
- alert(name); //毫无疑问地输出：casper
Tags: javascript 作用域
transition是css3中新添加的特性，在W3C标准中是这样描述 的：“css的transition允许css的属性值在一定的时间内从 一个状态平滑的过渡到另一个状态。这种状态可以在鼠标单击、获得焦点、被点击或对元素任何改变中触发，并平滑的以动画效果改变css的属性值。”有了transition一切动画都变得如此简单。
在今天的小贴士,我们将向您展示如何让你的菜单添加一个整洁的悬浮效果。
查看demo
Tags: css3 transition 菜单 动画
Backbone 视图的使用相当方便 — 它不会影响任何的 HTML 或 CSS 代码，并且可以与任意 Javascript 模板引擎兼容。 基本的做法就是，将界面组织到逻辑视图，之后是模型，当模型数据发生改变，视图立刻自动更新，这一切都不需要重绘页面。 我们再也不必钻进 JSON 对象中，查找 DOM 元素，手动更新 HTML 了，通过绑定视图的 render 函数到模型的 "change" 事件 — 模型数据会即时的显示在 UI 中。
前期准备模板
- <script type="text/template" id="search_template">
- <label><%= label_text %></label>
- <input type="text" id="search_input" />
- <input type="button" id="search_button" value="Search" />
- </script>
Tags: backbone
模型 是所有 Javascript 应用程序的核心，包括交互数据及相关的大量逻辑： 转换、验证、计算属性和访问控制。你可以用特定的方法扩展 Backbone.Model ， 模型 也提供了一组基本的管理变化的功能。
extendBackbone.Model.extend(properties, [classProperties])
要创建自己的 模型 类，你可以扩展 Backbone.Model 并提供实例 属性 ， 以及可选的可以直接注册到构造函数的 类属性 (classProperties)。
extend 可以正确的设置原型链，因此通过 extend 创建的子类 (subclasses) 也可以被深度扩展。
Tags: backbone
backbone.js，是开发web app的框架。凭借它，我们可以使用javascript编写复杂交互的web app，因为backbone提供了强大的对模型、视图和交互的抽象。 以前，我们开发web app，比较依赖比如jQuery.js、underscore.js：
- 将所有交互看作对dom节点的操作，虽然也可通过事件（event）解藕复杂的交互，但是无法脱离dom模型，包括事件的传递，都是沿着dom树进行的；
- 即使是有起到模型作用的对象，一般也通过jQuery附着在dom树上
Tags: backbone
transition是css3中新添加的特性，在W3C标准中是这样描述 的：“css的transition允许css的属性值在一定的时间内从 一个状态平滑的过渡到另一个状态。这种状态可以在鼠标单击、获得焦点、被点击或对元素任何改变中触发，并平滑的以动画效果改变css的属性值。”
Tags: transition css3
将后台程序(如php)发送过来的json数据转化为javascript的数组或者对象的方法十分简单，代码如下：
- // 假设后台发送的json数据为 '{a:2,b:1}' 存储于str中
- var data = eval( '(' + str + ')' );
然而想将一个javascript对象转化为json格式的字符串却并不那么简单，特别是对象的属性值递归包含一个对象时(如 var obj={a:[2,3],b:{m:[3,4],n:2} } ),那么有没有什么方法将obj转化为json格式的字符串呢？
这是一个效果图
最近在做一个自定义表单的项目，由于各种原因，需使用前台javascript模板，上网google了一下，javascript模板方面的介绍不是很多，不像extjs等框架已经有很成熟的模板系统了，最近微软也发布了一个基于jquery的模板插件（http://github.com/nje/jquery-tmpl），基本用法类似，这些模板都定义了自己专用的模板语言。同事介绍了一个mustache.js的模板类，与大家分享下。
Web 开发者需要经常更新他们的知识，学习新的技术，如果他们还想继续在 Web 开发领域混并混得还不错的话。下面将为你展示 7 项新的Web开发技术，作为一个Web开发人员，你需要了解、熟悉并学会的技术。
CSS3 media queries
目前，大量的智能手机设备的涌现，同时各种不同尺寸屏幕的设备，如平板电脑之类的出现，对Web开发带来了前所未有的挑战，如何让 Web 页面能适应各种尺寸的屏幕让很多 Web 开发人员相当的纠结。幸运的是 CSS3 规范可帮我们轻松的解决此事，你可以根据不同尺寸的屏幕定义不同的 CSS 样式。
原文地址：http://www.alfajango.com/blog/exploring-jquery-live-and-die/
作者和大多数的开发人员都知道jQuery的.live()函数，知道它是做什么用的，但是不知道它是怎么样工作的，使用起来也不得心应手，甚至也没听说过.die()(去掉bind事件)。即使你能熟悉这些，但你能意识到.die() 的问题所在吗？
什么是 .live()？
函数的.live()类似.bind(),除此之外,它允许你绑定事件DOM元素现在和动态生成出来的dom节点,你可以绑定的事件不存在的元素。
原文地址：http://www.hujuntao.com/archives/ie6-position-fixed.html
CSS实现固定浮动层效果，类似于QQ空间顶部的工具条。标准浏览器、IE7+只需在CSS里面设置position:fixed;top:0;就可以了。不论你怎么滚动页面，工具条都会固定在头部。那么IE6怎么实现呢？
众所周知IE6 position不支持fixed属性，下面介绍两种纯CSS模拟实现position:fixed效果。
第一种：HTML、BODY高度100%方案
- * html {
- overflow-y: hidden;
- }/*只是定制垂直滚动fixed*/
- * html body {
- overflow-y: auto;
- height: 100%;
- }
- * html #fixedbox { /*把要固定的元素position设置为absolute */
- position: absolute;
- }
- #fixedbox {
- position:fixed;
- width:100px;
- height:100px;
- background:#000000;
- color:#FFFFFF;
- }
