摘要：
今天发现个很有趣的js判断全世界最短的代码，想想之前自己写的判断ie浏览器的，这个实在简单多了 var ie = !+"\v1"; 仅仅需要7bytes！参见这篇文章，《32 bytes, ehr ... 9, ehr ... 7!!! to know if your browser is IE》，讲述外国人是如何把IE的判定从32 bytes一步步缩简成7 bytes!的故事 但这纪录今年1月8日被一个俄国人打破了，现在只要6 bytes!它利用了IE与标准浏览器在处理数组的toString方法的差异做成的。对于标准游览器，如果数组里面最后一个字符为逗号，JS引擎会自动剔 阅读全文
随笔档案-2014年03月
初学者必看：精心整理的Javascript操作JSON总结
2014-03-18 20:49 by 盛世游侠, 248 阅读, 收藏,
摘要：
JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式，采用完全独立于语言的文本格式，是理想的数据交换格式。同时，JSON是 JavaScript 原生格式，这意味着在 JavaScript 中处理 JSON数据不须要任何特殊的 API 或工具包。 本文主要是对JS操作JSON的要领做下总结。 在JSON中，有两种结构：对象和数组。 1. 一个对象以“{”（左括号）开始，“}”（右括号）结束。每个“名称”后跟一个“:”（冒号）；“‘名称/值’ 对”之间运用 “,”（逗号）分隔。 名称用引号括起来；值如果是字符串则必须用括号，数值型则不须要。例如： ... 阅读全文
用实例一步步教你写Jquery插件
2014-03-18 20:48 by 盛世游侠, 270 阅读, 收藏,
摘要：
最近Web应用程序中越来越多地用到 了JQuery等Web前端技术。这些技术框架有效地改善了用户的操作体验，同时也提高了开发人员构造丰富客户 端UI的效率。JQuery本身提供了丰富的操作，但是，有时候我们需要根据我们自己的业务和系统特色（风格）构造一些我们常用的前端UI组件，而 JQuery的插件给了我们一个较好的方式来构造这些UI组件，方便我们日后反复重用这些组件。网上也有很多关于JQuery插件的文章，我也搜了一些，但是，这些文档太过离散，没有有效地组织并充分说明JQuey插件该如何编写，并且有哪几种形式，什么情况下使用哪种形式。下面，我将说明JQuery插件常用的写法，以及这些插件的常 阅读全文
学习一种新编程语言要做的14个练习
2014-03-18 20:42 by 盛世游侠, 274 阅读, 收藏,
摘要：
虽然我已经可以使用很多种编程语言进 行工作，但我的工作常常会要求我快速掌握一门新的语言。我没有选择去阅读几百页的程序手册，而是快速浏览10到15页的教程（可以在Google中搜 索），并把程序语言的语法参考说明印在小卡片上（在google里搜索language to learn+reference card就能找到）。首先，我会熟悉这种程序语言的编译器、编译选项、编辑器或集成开发环境的的快捷键和小技巧，写一个简单的“你好世界”程序，编译并运行它，再用调试器进行简单的调试，如设置断电、查看变量值、跳转到某一位置等。为了能够快速地掌握一种新的程序语言，我会做以下几个练习。注意，有些程序对初学者来说 阅读全文
一些实战中总结的 javascript 开发经验
2014-03-18 20:38 by 盛世游侠, 328 阅读, 收藏,
摘要：
Javascript 的很多扩展的特性是的它变得更加的犀利， 同时也给予程序员机会创建更漂亮并且更让用户喜欢的网站。 尽管很多的开发人员都乐于颂扬 javascript，但是仍旧有人看到它的阴暗面。 使用很多 javascript 代码的 web 页面会加载很慢，过多的使用 javascript 使 阅读全文
JavaScript开发规范
2014-03-18 20:37 by 盛世游侠, 240 阅读, 收藏,
摘要：
作为一名开发人员（WEB前端JavaScript开发），不规范的开发不仅使日后代码维护变的困难，同时也不利于团队的合作，通常还会带来代码安全以 及执行效率上的问题。本人在开发工作中就曾与不按规范来开发的同事合作过，与他合作就不能用“愉快”来形容了。现在本人撰写此文的目的除了与大家分享一点 点经验外，更多的是希望对未来的合作伙伴能够起到一定的借鉴作用。当然，如果我说的有不科学的地方还希望各路前辈多多指教。下面分条目列出各种规范要求， 这些要求都是针对同事编码毛病提出来的，好些行业约定的其它规范可能不会再提及。 1、保证代码压缩后不出错 对于大型的JavaScript项目，一般会在产品发... 阅读全文
jQuery性能优化
2014-03-18 20:36 by 盛世游侠, 211 阅读, 收藏,
摘要：
在jQuery中最快的选择器是ID选择器，因为它直接来自于JavaScript的getElementById()方法。例如有一段HTML代码：程序代码交通信号灯 红色 黄色 绿色如果采用下面的选择器，那么效率是低效的。程序代码var traffic_button = $("#content .button");因为button已经有ID了，我们可以直接使用ID选择器。如下所示：程序代码var traffic_button = $("#traffic_button");当然 这只是对于单一的元素来讲。如果你需要选择多个元素，这必然会涉及到 DOM遍历和循环 阅读全文
不到30行JS代码实现的Excel表格
2014-03-18 20:35 by 盛世游侠, 282 阅读, 收藏,
摘要：
不到30行JS代码实现的Excel表格，jQuery并非不可替代 某国外程序员展示了一个由原生JS写成不依赖第三方库的，Excel表格应用，有以下特性：由不足30行的原生JavaScript代码实现不依赖第三方库Excel风格的语义分析(公式以"=" 开头)支持任意表达式(=A1+B2*C3)防止循环引用基于localStorage的自动本地持久化存储 效果展示： 代码分析： CSS略，HTML核心仅一行： JavaScript代码：for (var i=0; i<6; i++) { var row = document.querySelector("tab 阅读全文
javascript 执行顺序详解
2014-03-18 20:34 by 盛世游侠, 318 阅读, 收藏,
摘要：
JavaScript是一种描述 型脚本语言，它不同于java或C#等编译性语言,它不需要进行编译成中间语言,而是由浏览器进行动态地解析与执行。如果你不能理解javaScript 语言的运行机制，或者简单地说，你不能掌握javascript的执行顺序，那你就犹如伯乐驾驭不了千里马，让千里马脱缰而出，四处乱窜。 那么JavaScript是怎么来进行解析的吗？它的执行顺序又是如何的呢？在了解这些之前，我们先来认识几个重要的术语： 1、代码块 JavaScript中的代码块是指由 JS是按照代码块来进行编译和执行的，代码块间相互独立，但变量和方法共享。什么意思呢? 举个例子，你就明白了：... 阅读全文
新手必看的jQuery优化笔记十则
2014-03-18 20:33 by 盛世游侠, 227 阅读, 收藏,
摘要：
jQuery优化1.简介 jQuery正在成为Web开发人员首选的JavaScript库，作为Web开发者，除了要了解语言和框架的应用技巧外，如何提升语言本身的性能也是开发人员应该思考的问题。文章就以jQuery为例，为大家提供了10个有效提升jQuery性能的小技巧。 2. 合并、最小化脚本 大部分浏览器都不能同时处理多个脚本文件，所以它们都是排队加载——加载时间也相应地延长了。考虑到你网站的每个页面都会加载这些脚本，你应该考虑把它们放到单个文件中，然后利用压缩工具（比如Dean Edwards的这款）把它们最小化。更小的文件无疑将带来更快的加载速度。 引自YUI compressor，一款 阅读全文
编写更好的jQuery代码的建议
2014-03-18 20:29 by 盛世游侠, 167 阅读, 收藏,
摘要：
讨论jQuery和javascript性能的文章并不罕见。然而，本文我计划总结一些速度方面的技巧和我本人的一些建议，来提升你的jQuery和javascript代码。好的代码会带来速度的提升。快速渲染和响应意味着更好的用户体验。 首先，在脑子里牢牢记住jQuery就是javascript。这意味着我们应该采取相同的编码惯例,风格指南和最佳实践。 首先，如果你是一个javascript新手，我建议您阅读 《JavaScript初学者的最佳实践》 ，这是一篇高质量的javascript教程，接触jQuery之前最好先阅读。 当你准备使用jQuery，我强烈建议你遵循下面这些指南： 缓存变... 阅读全文
你需要知道的三个CSS技巧
2014-03-18 20:28 by 盛世游侠, 234 阅读, 收藏,
摘要：
各种浏览器之间的竞争的白热化意味着越来越多的人现在开始使用那些支持最新、最先进的W3C Web标准的设备，以一种更具交互性的方式来访问互联网。这意味着我们终于能够利用更强大更灵活的CSS来创造更简洁，更好维护的浏览器前端代码。现在让 我们来看一看一些也许你还不知道的让人兴奋的CSS 功能。 在CSS中用attr()显示HTML属性值 attr()功能早在CSS 2.1标准中就已经出现，但现在才开始普遍流行。它提供了一个巧妙的方法在CSS中使用HTML标签上的属性，在很多情况下都能帮你省去了以往需要Javascript处理的过程。 要想使用这个功能，你需要用到三种元素：一个:befor... 阅读全文
CSS3弹性盒模型布局模块介绍
2014-03-18 20:26 by 盛世游侠, 355 阅读, 收藏,
摘要：
来源：Robert’s talk原文：http://robertnyman.com/2010/12/02/css3-flexible-box-layout-module-aka-flex-box-introduction-and-demostest-cases/Web布局一直个是难点，但貌似现在我们有更好的选择了。背景首先,我们有表格布局。当不考虑语义并且利用一些适当的嵌套和其他技巧,我们可以用table建立具有一定功能的布局。然后是现在大多数人都在使用的浮动布局。我们可以使用任何我们想用的元素,但浮动并不适用于初学者。表面上它看起来很基础,但背后复杂的功能可以使经验丰富的开发者看着自己的屏幕 阅读全文
不用图片，纯Css3实现超酷的类似iphone的玻璃气泡效果
2014-03-18 20:25 by 盛世游侠, 371 阅读, 收藏,
摘要：
最近在一个私活做手机项目时候，需要实现一个类似ios 6中短信那样的气泡效果。这里分享下实现心得，希望能给大家一点启发。首先分析下iphone的气泡效果有一下特点1. 四面圆角2. 界面上向下的外阴影3. 上边和下边的内阴影4. 上边内的一个内嵌的玻璃气泡的反光效果因为文字的长度、高度，内容多少都未知，所以如果用图片，会涉及到了多张拼贴，而且效果不好，所以就选择了CSS3。首先定义一个容器，盒模型为display: inline-block，方便自适应文字大小.bubble {position: relative;display: inline-block;min-width: 30px;ma 阅读全文
牛人推荐的跨浏览器兼容性总结
2014-03-18 20:23 by 盛世游侠, 237 阅读, 收藏,
摘要：
一、 CSS样式兼容1. FLOAT闭合（clearing float）网页在某些浏览器上显示错位很多时候都是因为使用了float浮动而没有真正闭合，这也是div无法自适应高度的一个原因。如果父div没有设 float而其子div却设了float的话,父div无法包住整个子DIV，这种情况一般出现在一个父DIV下包含多个子DIV。解决办法：1) 给父DIV也设上float2) 在所有子DIV后新加一个空DIV（目前Ext是这么做的），比如：.parent{width:100px;}.son1{float:left;width:20px;}.son2{float:left;width:80px; 阅读全文
高手总结的CSS执行顺序及其优先权问题汇总
2014-03-18 19:20 by 盛世游侠, 5202 阅读, 收藏,
摘要：
今天在看一本书时又看到了”CSS优 先权“这个问题，感觉这个问题还是比较重要的，也算是样式的特异性吧，尤其是在面对较多、较深层、较复杂的样式属性时，理解CSS的加权计算方法对于重写 样式属性之类的问题都会迎刃而解。那么接下来我就把CSS的执行顺序及其优先权问题做一个小小的总结吧。1、CSS的执行顺序在说CSS的执行顺序之前首先让我们看一下CSS的几种使用方式：·外联样式表通过语句 导入CSS样式文件·内联样式表直接在里面写入内嵌样式表直接在HTML里面写入CSS样式(虽然不提倡这么做，但在这里为了说明问题还是要提一下)，如： BeyondWeb.cn-记录与分享前端开发的点 阅读全文
常用CSS缩写语法总结
2014-03-18 18:32 by 盛世游侠, 204 阅读, 收藏,
摘要：
使用缩写可以帮助减少你CSS文件的大小，更加容易阅读。css缩写的主要规则如下： 颜色 16进制的色彩值，如果每两位的值相同，可以缩写一半，例如： #000000可以缩写为#000;#336699可以缩写为#369; 盒尺寸 通常有下面四种书写方法:property:value1; 表示所有边都是一个值value1；property:value1 value2; 表示top和bottom的值是value1,right和left的值是value2property:value1 value2 value3; 表示top的值是value1，right和left的值是value2，botto... 阅读全文
CSS浏览器兼容问题集-第一部分
2014-03-18 18:26 by 盛世游侠, 240 阅读, 收藏,
摘要：
CSS对浏览器的兼 容性有时让人很头疼,或许当你了解当中的技巧跟原理,就会觉得也不是难事,从网上收集了IE7,6与Fireofx的兼容性处理方法并整理了一下.对于 web2.0的过度,请尽量用xhtml格式写代码,而且DOCTYPE影响CSS处理,作为W3C的标准,一定要加DOCTYPE声名.CSS技巧1.div的垂直居中问题vertical-align:middle;将行距增加到和整个DIV一样高line-height:200px;然后插入文字，就垂直居中了。缺点是要控制内容不要换行2.margin加倍的问题设置为float的div在ie下设置的margin会加倍。这是一个ie6都存在的.. 阅读全文
浙公网安备 33010602011771号