随笔分类 - [10]JS
-
geek 的博客
摘要:hexo 适合前端 geek 的博客原文出自:http://www.qiangji.tk/hexo%E9%80%82%E5%90%88%E5%89%8D%E7%AB%AFgeek%E7%9A%84%E5%8D%9A%E5%AE%A2/hexo 是一个基于 Node.js 的静态博客程序,编译上百篇文字只需要几秒,和Octopress项目,速度占有很大的优势。hexo 只需要将生成静态网页放到服务器上就可以了,所以可以将博客托管在github、hreoku、bae等平台上。项目地址https://github.com/tommy351/hexo官网http://zespia.tw/hexo作者h 阅读全文
-
query 原理
摘要:query原理的简单分析,让你扒开jquery的小外套。引言 最近LZ还在消化系统原理的第三章,因此这部分内容LZ打算再沉淀一下再写。本次LZ和各位来讨论一点前端的内容,其实有关jquery,在很久之前,LZ就写过一篇简单的源码分析。只不过当时刚开始写博客,写的相对来讲比较随意,直接就把源码给贴上来了,尽管加了很多注释,但还是会略显粗糙。 这次LZ再次执笔,准备稍微规范一点的探讨一下jquery的相关内容。jquery的外衣 jquery是一个轻量级的JS框架,这点相信大部分人都听过,而jquery之所以有这样一个称呼,就是因为它悄悄披了一件外衣,将自己给隐藏了起来。//以下截取自jqu... 阅读全文
-
秒杀9种排序算法(JavaScript版)
摘要:从is(":checked")说起*此文所用jQuery版本应大于1.6.1如何判断一个单选(复选)框是否选中。对于刚接触jQuery的人,第一反应必然是。$("#checkbox1").attr("checked") // checked$("#checkbox2").attr("checked") // undefined无论是否选中,返回的值一直是 checked 。(至于为什么返回的是checked,那是因为checked属性对应的值只有checked这一个,所以写什么checked=f 阅读全文
-
Emmet使用手册
摘要:前端开发必备!Emmet使用手册介绍Emmet (前身为 Zen Coding) 是一个能大幅度提高前端开发效率的一个工具:基本上,大多数的文本编辑器都会允许你存储和重用一些代码块,我们称之为“片段”。虽然片段能很好地推动你得生产力,但大多数的实现都有这样一个缺点:你必须先定义你得代码片段,并且不能再运行时进行拓展。Emmet把片段这个概念提高到了一个新的层次:你可以设置CSS形式的能够动态被解析的表达式,然后根据你所输入的缩写来得到相应的内容。Emmet是很成熟的并且非常适用于编写HTML/XML 和 CSS 代码的前端开发人员,但也可以用于编程语言。使用示例:在编辑器中输入缩写代码:ul& 阅读全文
-
发挥jQuery的威力
摘要:发挥jQuery的威力由于当前jQuery如此的如雷贯耳,相信不用介绍什么是jQuery了,公司代码中广泛应用了jQuery,但我在看一些小朋友的代码时发现一个问题,小朋友们使用的仅仅是jQuery的皮毛,只是使用id选择器与attr方法,还有几个动画,如果只是如此,相比于其带来的开销,其实还不如不使用,下面介绍几个jQuery常用的方法,来让jQuery的威力发挥出来,否则只用有限的几个方法,相对于运行速度问题,真不如不用jQuery。jQuery如此之好用,和其在获取对象时使用与CSS选择器兼容的语法有很大关系,毕竟CSS选择器大家都很熟悉(关于CSS选择器可以看看十分钟搞定CSS选择器) 阅读全文
-
使用jsdoc-toolkit来自动生成js api文档
摘要:使用jsdoc-toolkit来自动生成js api文档来前端组小盆友开发的类库越来越多,很多情况下彼此不知道写了些什么方法,为了更好的合作提高工作效率,找了个比较好的api文档生成方法。使用jsdoc-toolkit来自动生成js api文档。一、环境搭建1)首先要安装java环境,如果不太了解的参看:http://jingyan.baidu.com/article/e75aca85b29c3b142edac6a8.html2)安装jsdoc-toolkit下载地址:http://code.google.com/p/jsdoc-toolkit/downloads/list解压下载的压缩包(可 阅读全文
-
Backbone.js的技巧和模式
摘要:Backbone.js的技巧和模式Backbone.js的技巧和模式本文由白牙根据Phillip Whisenhunt的《Backbone.js Tips And Patterns》所译,整个译文带有我自己的理解与思想,如果译得不好或不对之处还请同行朋友指点。如需转载此译文,需注明英文出处:http://coding.smashingmagazine.com/2013/08/09/backbone-js-tips-patterns/,以及作者相关信息作者:Phillip Whisenhunt译者:白牙Backbone.js是一个开源JavaScript“MV*”框架,在三年前它的第一次发布的时 阅读全文
-
JavaScript之创建对象
摘要:不定义JQuery插件,不要说会JQuery一:导言 有些WEB开发者,会引用一个JQuery类库,然后在网页上写一写$("#"),$("."),写了几年就对别人说非常熟悉JQuery。我曾经也是这样的人,直到有一次公司里的技术交流,我才改变了自己对自己的看法。二:普及JQuery知识知识1:用JQuery写插件时,最核心的方法有如下两个:$.extend(object) 可以理解为JQuery 添加一个静态方法。$.fn.extend(object) 可以理解为JQuery实例添加一个方法。基本的定义与调用:/* $.extend 定义与调用* * * 阅读全文
-
highlight高亮
摘要:玩转正则之highlight高亮2013-10-07 05:16 by 靖鸣君,584阅读,3评论,收藏,编辑 程序员在编写代码的时候少不了和字符串以及“查询”打交道,两者的交集中有一个叫做正则表达式的的东西,这家伙用好了可以提高编程效率,用不好的话...你可以先去好好学一学。 关于正则的使用,举个简单的例子:var m = location.href.match(/(\w+:)\/{0,3}([^\/]+)(?:(\/[^\?#]*))?(?:(\?[^#]+|.+))?(?:(#.*))?/);var res = { protocol: m[1], host: m[2], ... 阅读全文
-
JavaScript 垃圾回收
摘要:JavaScript 垃圾回收公司经常会听到大牛们讨论时说道内存泄露神马的,每每都惊羡不已,最近精力主要用在了Web 开发上,读了一下《JavaScript高级程序设计》(书名很唬人,实际作者写的特别好,由浅入深)了解了一下JavaScript垃圾回收机制,对内存泄露有了一定的认识。和C#、Java一样JavaScript有自动垃圾回收机制,也就是说执行环境会负责管理代码执行过程中使用的内存,在开发过程中就无需考虑内存分配及无用内存的回收问题了。JavaScript垃圾回收的机制很简单:找出不再使用的变量,然后释放掉其占用的内存,但是这个过程不是时时的,因为其开销比较大,所以垃圾回收器会按照固 阅读全文
-
前端面霸系列(1):doctype 、Quirks Mode & Standards Mode 、document.compatMode
摘要:前端面霸系列(1):doctype 、Quirks Mode & Standards Mode 、document.compatMode近几日,气压猛降,雾霾铺天盖地,眼看一场腥风血雨就要前端江湖爆发,这场战争不仅是百度、腾讯、阿狸、搜狐网易新浪等江湖豪门抢夺人才的大战,也是诸位江湖人士重新洗牌的好时机。每年10月,江湖的波动胜过华山论剑、五岳争主。如今这江湖人才济济,新门派如雨后春笋,江湖高手更是各个身怀绝技。在博客园这个擂台上更是齐聚各路高手。本人wisdomoon是一名懒人,没有"汤姆大叔"的盖世神功,也没有"T2噬菌体"的严谨细腻,更没有 阅读全文
-
Weibo用户地图
摘要:Weibo用户地图1.1.1 摘要现在,许多应用都提供地理位置定位的功能,只要用户开放他们的位置信息就可以实现定位了,今天我们将创建一个基于Google 地图的微博用户地图,这里我们将通过Weibo API获取微博用户的地理信息,然后使用Google地理位置服务将用户的地理信息转换为相应的地理坐标,最后,根据地理坐标加载到Google地图中显示。目录Index页面Javascript实现CSS样式1.1.2 正文Index页面首先,我们定义程序的Index页面,它用于加载显示Google地图,具体实现如下: ... 阅读全文
-
jQuery插件综合应用1
摘要:jQuery插件综合应用(一)注册一、介绍注册和登录是每个稍微有点规模的网站就应该有的功能。登陆功能与注册功能类似,也比注册功能要简单些。所以本文就以注册来说明jQuery插件的应用。jQuery插件的使用非常简单,如果只按照jQuery插件demo中的演示使用,基本上很快就能上手。但是如果按照我们的需要进行操作,还真需要一些技巧。下面会以nanoscroller进行说明。提到注册功能,无非就是对用户的注册信息进行验证,验证用户输入的注册信息是否合法,在jQuery插件中,validation插件可以实现验证功能。如果用户的信息合法,只需要用户同意“网站的协议”,就允许进行下一步操作————注 阅读全文
-
弹出框页面中使用jquery.validate验证控件
摘要:弹出框页面中使用jquery.validate验证控件有几个问题需要解决:1,弹出框的提交事件完成后如何关闭弹出框页面?2,提交不成功如何返回当前页?3,如果知道验证事件成功?之前笔者都是JS验证控件,放着强大的jquery.validate控件不用,自己写验证,会是让追求程序完美的人心里有种淡淡的忧伤。不过还好,今天下午笔者花了点时间,已实现这种功能,虽然也不是很完美,但也基本能用了。先看下效果,一会再上代码。当验证通过后,程序后台开始提交,提交成功,当前弹出框关闭。为此代码如下。1,打开弹出框。 function AnswerDialog(id) { $... 阅读全文
-
JavaScript事件的几个细节
摘要:JavaScript事件的几个细节一、是捕获还是冒泡昨天被问到一个问题:事件流有几个阶段?在这几个阶段中,事件一共发生几次?问题很简单,但对于事件一共发生几次有点乱。总觉得捕获也能触发事件、冒泡也能触发事件,可事件确实只发生了一回啊!所以写篇文章梳理一下,对此很清楚的同学可以跳过了。子问题1:事件流有几个阶段?“DOM2级事件”规定的事件流包括三个阶段:事件捕获阶段、处于目标阶段和事件冒泡阶段。1. IE9以前的IE浏览器都只支持后两个阶段,也就是处于目标阶段和事件冒泡阶段。这个顺序很好理解,在嵌套层次最深的节点上接收事件,然后逐级向上传播到父级节点。2. 早期的Netscape团队提出的另一 阅读全文
-
Javascript:看 Javascript 规范,学 this 引用,你会懂的。
摘要:目录背景this待分析程序先看一个语言规范方法调用备注背景返回目录Javascript 的 this 是我的心病,多数情况下知道其运行结果,个别变态的场景下,就给不出解释了,昨天一次偶然的机遇让我有兴趣尝试看一看 Javascript 语言规范,一看就悟了。偶然的机遇就是一篇文章:http://www.cnblogs.com/aaronjs/p/3339107.html,这篇文章中关于 this 的部分我错了1/4。this返回目录待分析程序返回目录 1 var x = 10; 2 var foo = { 3 x: 20, 4 bar: function () { 5 ... 阅读全文
-
js中内置有对象
摘要:statpot:使用mongo+bootstrap+highcharts做统计报表最近做了一个统计项目,这个统计项目大致的需求是统计接口的访问速度。客户端会调用一个接口来记录接口的访问情况,我的需求就需要分析这些数据,然后做出个统计报表。需求实现最初的时候想着每天把这些接口访问情况的信息存储到mysql中,然后根据这些访问情况做个分析再做报表。然后第一个问题就来了,信息包含太多字段了,如果我将每个信息解析成mysql表的一个字段,那么这个字段很长,而且还有一个致命缺陷,不容易扩展。如果将所有字段都存储为一个json,然后存储到text字段呢,又没法建立索引了。所以这种情况,最适合搬出mongo 阅读全文
-
Js面向对象编程
摘要:Js面向对象编程1.什么是面向对象编程?我也不说不清楚什么是面向对象,反正就那么回事吧。编程有时候是一件很快乐的事,写一些小游戏,用编程的方式玩游戏等等2.Js如何定义一个对象一般变量的定义方法varname = '小明';varemail = 'xiaoming@chinaedu.net';varwebsite = 'http://chinaedu.net';写成对象的方式:varxiaoming = { name : '小明', email : 'xiaoming@chinaedu.net', website 阅读全文
-
Js杂谈-正则的测试与回溯次数
摘要:Js杂谈-正则的测试与回溯次数例子来源于这本书,我贴出来:这里的NFA是正则的一种引擎,书中介绍了一共三种引擎:NFA,DFA和POSIX NFA。像一般我们常用的.NET,java.util.regex中都使用传统型的NFA。这里纠正下书中的印刷错误,第二条正则是/"([^\\*]|\\.)*"/,类似将选择分支颠倒。先从第一条正则开始:/"(\\.|[^\\"])*"/根据匹配优先,尽可能多的去匹配文本,筛选条件根据NFA引擎的原理,从左开始依次筛选。至于最后的"号为什么测试3次,首先先尝试与两种分支情况匹配,都失败,最后用正则的 阅读全文
-
分析Sizzle引擎
摘要:jQuery 2.0.3 源码分析Sizzle引擎 - 打造高效查询为什么Sizzle很高效?首先,从处理流程上理解,它总是先使用最高效的原生方法来做处理HTML文档一共有这么四个API:getElementById 上下文只能是HTML文档 浏览器支持情况:IE6+, Firefox 3+, Safari 3+, Chrome 4+, and Opera 10+;getElementsByName,上下文只能是HTML文档浏览器支持情况:IE6+, Firefox 3+, Safari 3+,Chrome 4+, and Opera 10+;getElementsByClassName浏览器 阅读全文