上次浅谈了下关于CSS的编码规范，大部分童鞋持赞同意见，仍存在一些童鞋不太理解这些规范的意义。   如果是个人或者小作坊开发，其实这些所谓的编码规范也没啥意思，因为大家写好的代码直接就给扔到网上去了，很少有打包、压缩、校检等过程，别人来修改你代码的情况也比较少。但是，对于一定规模的团队来说，这些东西还是挺有必要的！一个是保持代码的整洁美观，同时良好的代码编写格式和注释方式可以让后来者很快地了解你代码的大概思路，提高开发效率。   那么这次，继续抛砖引玉，说说Javascript一些需要引起注意的地方（这些东西也是团队开发的时候大家集思广益总结出来的）。 不规范写法举例 1. 句尾没有分号 v...

JavaScript是一门弱语言，她使用起来不像C/C++那样有十分繁琐的内存管理、类型定义等，所以学习JavaScript的门槛相对来说也比较低。门槛低并不意味着这门语言很简单，我们在使用的时候会遇到各种千奇百怪的问题，有些是因为浏览器的兼容性引起的，有些是因为JS语法本身所引起的，还有些是因为ECMAScript标准的改变而引起的，总之，这样的问题很多，下面列举 几个比较容易忽略的点   1. switch的case判断 var t = event.keyCode; switch (t) { case '65': alert("Yay!"); ...

对于JavaScript初学者来说，闭包是一个很神秘的东西，不管看多少遍，依旧搞不清楚闭包是什么，更不明白其内部是什么样的处理机制（更可恶的是每次面试都会被问到）。   说的含糊一点，闭包就是代码块和该代码块上下文（context）相互作用的产物。看一个例子： function foo(){ var x = 1; return function (){ alert(++x); //2 } } var bar = foo(); bar();运行代码   先问一个问题，这里到底谁是闭包？是foo还是那个匿名函数？ 闭包的产生原理   在JavaScrip...

程序员在编写代码的时候少不了和字符串以及“查询”打交道，两者的交集中有一个叫做正则表达式的的东西，这家伙用好了可以提高编程效率，用不好的话...你可以先去好好学一学。   关于正则的使用，举个简单的例子： var m = location.href.match(/(\w+:)\/{0,3}([^\/]+)(?:(\/[^\?#]*))?(?:(\?[^#]+|.+))?(?:(#.*))?/); var res = { protocol: m[1], host: m[2], path: m[3], search: m[4], hash: m[5] }; ...

 上次如何培育新人一文中也提到了自己学习前端的一些事儿，这两天几个新人问我当初是如何逐步学习前端的，因为以前也没做过什么记录，时间虽不长，记忆却开始模糊了，趁着还有些感觉，把这些往事都写下来。   之前看聂微东大哥的文章，有一篇说到了他学习前端的经历(说说我的web前端之路,分享些前端的好书)，主要是推荐几本前端学习的书籍，童鞋们可以去瞅一瞅。我想分享的并不是这些书籍，而是学习前端技术的一些经历，当然，也包括一些书籍。 初识前端   第一次和前端打交道，是大一的时候。那时我的一个舍友加入了学校很有名誉的一个技术团队——联创团队，在design组做美工设计和简单的网页开发。一天晚上，宿舍熄灯了，...

人可以通过查看网站信息了解网站的内容，但是搜索引擎只对标签感兴趣，对内容的识别能力是很低的，如何让蜘蛛通过标签认识你的文章内容呢~ 原文网址：http://schema.org/docs/gs.html本文地址：http://www.cnblogs.com/hustskyking/p/let-your-page-understood-by-search-engine.html译者：Barret Lee日期：2013-11-01 许多站长应该对HTML标签十分熟悉，HTML标签告诉浏览器如何去呈现标签的内容，比如<h1>阿凡达</h1>，告诉浏览器用大标题的形式显示“...

刚截图十几次，终于捕捉到了这个白屏现象，hiahia~~ 大家可以很清晰地看到下边还木有渲染完毕的透明层，这是一个十分普遍的问题，经常遇到。我的浏览器版本是 到目前为止应该是最新版(release版本)，之前的版本应该也存在类似的问题。只要处理好代码，这种体验相当不好的白屏问题是可以避免的，Qzone的页面貌似就没有这个现象。首先我们来聊一聊这个问题是怎么产生的，这涉及到chrome浏览器对网页的解析和渲染。 渲染引擎首先通过网络获得所请求文档的内容，通常以8K分块的方式完成。下面是渲染引擎在取得内容之后的基本流程：解析html以构建dom树->构建render树->布局re...

很多人都会问这样一个问题，我们在登录的时候，密码会不会泄露？随便进一个网站，登录时抓包分析，可以看到自己的密码都是明文传输的，在如此复杂的web环境下，我们没有百分的把握保证信息在传输过程中不被截获，那不使用明文如何告诉服务器自己的身份呢？ 在一些高度通信安全的网络中，数据传输会使用HTTPS作为传输协议，但是通常情况下我们没必要使用HTTPS传输，虽说安全，但传输数据都需要加密解密，很费时。我们可以使用一些加密方式（如md5）对密码进行加密，如果仅仅只对密码加密那肯定是没有任何作用，所以可以在密码中加入一些其他的字符，合并之后使这个密码成为一个临时密码~ <label>usern...

ECMAScript 6 是JavaScript的下一个标准，正处在快速开发之中，大部分已经完成了，预计将在2014年正式发布。Mozilla将在这个标准的基础上，推出JavaScript 2.0。 ECMAScript 6 的目标，是使得JavaScript可以用来编写复杂的应用程序、函数库和代码的自动生成器（code generator）。 最新的浏览器已经部分支持ECMAScript 6 的语法，可以通过《ECMAScript 6 浏览器兼容表》查看浏览器支持情况。 ECMAScript 6 新内容一览 let, const (定义块级局部变量), 函数在块级域中 解构: let {...

ECMAScript 6中多了两个定义变量的关键词，一个是let，另一个是const，后者顾名思义就是常量定义，前者的作用域范围是块级的。 一般写过js的童鞋都知道，同其他语言一样，JS中的变量作用域是函数域而不是块级分割的，但是涉及到变量提升（hosting），闭包等问题的时候，很多有经验的程序员依然会头疼。 var a = 5; if(true){ var a = 10; } console.log(a);//10上面的结果是10，但是我们看到，在if block内外都有一个a的定义，按我们正常的理解来看，这两个a应该占用的是不同的内存，而事实上，他们共用同一个内存。为此，ES 6...

一、前言 什么是模板引擎，说的简单点，就是一个字符串中有几个变量待定。比如： var tpl = 'Hei, my name is <%name%>, and I\'m <%age%> years old.';通过模板引擎函数把数据塞进去， var data = { "name": "Barret Lee", "age": "20" }; var result = tplEngine(tpl, data); //Hei, my name is Barret Lee, and...

一、前言 web发展经历了一个漫长的周期，最开始很多人认为Javascript这们语言是前端开发的累赘，是个鸡肋，那个时候人们还享受着从一个a链接蹦到另一个页面的web神奇魔术。后来随着JavaScript的不断更新换代，他的功能不仅仅是为网页添加一点特效了，语言本身的加强以及对DOM操作能力的提升让他在前端大放光彩。尤其是ajax的出现，让JavaScript以及整个web的发展翻开了崭新的一页。 利用ajax局部刷新页面，相信很多人玩得相当熟练了。如果整个页面的刷新都是使用ajax，我们可以称之为一个webapp，所有的逻辑都是在当页处理，这种形式的页面带来的体验是十分不错的，减少了那些比...

web通信，一个特别大的topic，涉及面也是很广的。因最近学习了 javascript 中一些 web 通信知识，在这里总结下。文中应该会有理解错误或者表述不清晰的地方，还望斧正！ 一、前言 1. comet技术 浏览器作为 Web 应用的前台，自身的处理功能比较有限。浏览器的发展需要客户端升级软件，同时由于客户端浏览器软件的多样性，在某种意义上，也影响了浏览器新技术的推广。在 Web 应用中，浏览器的主要工作是发送请求、解析服务器返回的信息以不同的风格显示。AJAX 是浏览器技术发展的成果，通过在浏览器端发送异步请求，提高了单用户操作的响应性。但 Web 本质上是一个多用户的系统，对任何...

在上一篇提高到了 web 通信的各种方式，包括 轮询、长连接 以及各种 HTML5 中提到的手段。本文将详细描述 WebSocket协议 在 web通讯 中的实现。 一、WebSocket 协议 1. 概述 websocket协议允许不受信用的客户端代码在可控的网络环境中控制远程主机。该协议包含一个握手和一个基本消息分帧、分层通过TCP。简单点说，通过握手应答之后，建立安全的信息管道，这种方式明显优于前文所说的基于 XMLHttpRequest 的 iframe 数据流和长轮询。该协议包括两个方面，握手链接（handshake）和数据传输（data transfer）。 2. 握手连接 这部分...