与浏览器进行交互的时候浏览器就会触发各种事件。比如当我们打开某一个网页的时候，浏览器加载完成了这个网页，就会触发一个 load 事件；当我们点击页面中的某一个“地方”，浏览器就会在那个“地方”触发一个 click 事件。 这样，我们就可以编写 JavaScript，通过监听某一个事件，来实现某些功能扩展。例如监听 load 事件，显示欢迎信息，那么当浏览器加载完一个网页之后，就会显示欢迎信息。 下

对于富客户端的 Web 应用页面，自动登录、页面修改、抓取页面内容、屏幕截图、页面功能测试...面对这些需求，使用后端语言需要花费不少的精力才能实现。此时 SlimerJS、phantomJS 或 CasperJS 或许是更好的一种选择。 一、PhantomJS 和 SlimerJS PhantomJS 和 SlimerJS 都是服务器端的 JavaScript API 工具，可以理解为无界面的可

实现文本水平和垂直居中的方法有很多，但都是通过各种技巧来实现，优劣点都会存在。 CSS3 Flex 弹性盒模型在 IE11 及其他现代浏览器中已广泛支持，其丰富的功能和繁多的属性定义，使得入门起来有点抽象难懂。 这里只通过示例简单介绍使用 CSS3 Flex 弹性盒布局方式，实现文本居中的方法。 CSS 核心代码： display: flex; align-items: center; justi

作为 Web 前端开发者，基于浏览器的幻灯演示，相比 Microsoft PPT 这种传统的幻灯片软件来说拥有很多的优势。但如果完全自己来实现，又明显非常的麻烦。那么有没有简单易用的开源组件呢？如果你以这样的目的正在寻找，impress.js 或许就是你所需要的。 impress.js 是一个基于 css3 和 javascript 开发的演示工具，基于 webkit 浏览器（Chrome、Saf

1. 什么是 bower，有什么作用 富客户端要求的前端开发，少不了大量的前端库文件引用，于是就可能遇到如下问题： 逐个下载、复制到期望位置嫌麻烦 库之间的依赖/版本依赖不清楚，总是出问题 版本升级时重复性的操作，还易搞错 ... 使用 bower 这样的包管理工具，可以很好的处理类似如上描述的问题。其实各种包管理工具的主要职责均类似如此。 2. bower 安装 需要系统已安装 nodejs。命

JavaScript 没有一个权威的编码风格指南，取而代之的是一些流行的编码风格： Google的JavaScript风格指南（以下简称Google） http://google-styleguide.googlecode.com/svn/trunk/javascriptguide.xml NPM编码风格（以下简称NPM） https://npmjs.org/doc/coding-style.ht

1. 什么是 JSHint JSHint（http://www.jshint.com/）是一个JavaScript语法和风格检查工具，你可以用它来提醒代码风格相关的问题。它可以很好地被集成到许多常用的编辑器中，是统一团队编码风格的一个很好的工具。 JSHint Home: http://www.jshint.com/ JSHint Options: http://www.jshint.com/op

grunt 是前端开发的自动化构建工具，对于需要反复重复的任务，例如压缩（minification）、编译、单元测试、linting 等，自动化工具可以减轻你的劳动，简化你的工作。 下面志文工作室以一个项目的构建为例，简介入门 grunt 进行前端开发的过程，主要涉及到 javascript 代码合并与压缩，css 代码合并与压缩，以及图片压缩。 1. 安装 grunt 依赖 nodejs，首先安

  无刷新文件上传是一个常见而又有点复杂的问题，常见的解决方案是构造 iframe 方式实现。 在 HTML5 中提供了一个 FormData 对象 API，通过 FormData 可以方便地构造一个表单请求，并通过 XMLHttpRequest 来发送。通过 FormData 对象发送文件也是可以的，如此则无刷新上传就变的非常简单了。 那么 FormData 怎么使用呢？下面志文工作室

HTML5 的 postMessage 方法可实现不同窗体间互相通信。 postMessage 支持实现跨文档消息传输（Cross Document Messaging），并且可跨域传输信息。Internet Explorer 8, Firefox 3, Opera 9, Chrome 3和 Safari 4 以上版本浏览器都已支持 postMessage。 1. postMessage 功能简介