随笔分类 - [10]JS
-
闭包
摘要:JavaScript备忘录(2)——闭包语句JavaScript是解释型语言,解释器是按照顺序逐句执行的(除了进行一些少量预处理,如将函数声明提前)。顺序是由流程控制语句来控制的,常用的流程控制语句包括:条件控制语句:if...else和switch...case语句循环控制语句:while...、do...while、for和for-in语句其他:break、continue和try...catch语句代码中除去流程控制语句,剩下的部分只做两件事:为变量赋值(声明新变量并复制如var obj = {word: "hello"},或为已有变量赋值x=y)调用函数,比如con 阅读全文
-
mmDeferred
摘要:前端异步解决方案——mmDeferredDeferred是前端解决异步操作的一种编程范式,后来出现的Promise规范更是让其普适性大大提高。不过Promise规范也存在分岐。现在最流行的是Promise/A规范。Promise/A大致是这样的:一个带有then方法的对象,它拥有三个状态,pending,fulfilled, rejected。一开始是pending,执行then 方法后,当其回调被执行,会进入fulfiled或rejected状态。then方法可传入两个函数,一个是成功时执行,一个是失败时执行,分别叫做onFulfilled, onRejected。then还有第3个参数叫做 阅读全文
-
jQuery中的事件监听方式及异同点
摘要:jQuery中的事件监听方式及异同点作为全球最知名的js框架之一,jQuery的火热程度堪称无与伦比,简单易学的API再加丰富的插件,几乎是每个前端程序员的必修课。从读《锋利的jQuery》开始,到现在使用jQuery有一年多的时间了,对jQuery算是比较了解了,唯一没做到的就是读源码。网上看到有人写jQuery源码解析的,我也没细看,个人觉得如果光是为了解析源码而解析源码,未免有点太劳神了,没有实际用途,我更倾向于在实际应用中遇到不懂的方法或是文档说明不清楚的地方,可以查找到相应的位置看下源码,足矣。 闲话不多讲了,今天的主题是jQuery中的事件监听器的绑定方式。在学习jQuery之初. 阅读全文
-
JavaScript备忘录(1)——内置类型
摘要:JavaScript备忘录(1)——内置类型JavaScript有一些内置类型,还有很多常用的内置的方法,本文稍作总结,以备查阅。值类型我的理解,值类型是分配在栈上的,而引用类型(当然也包括引用类型内部的值类型)是分配在堆上的。值类型是不可以改变的,比如:var s = "hello";s = "hello2";上述并没有将字符串"hello"改成"hello2",而是新创建了一个字符串"hello2",前一个字符串仍然存在(只不过无法访问了),并于当前作用域被回收时销毁。值类型很简单,有五种: 阅读全文
-
IE Javascript 进阶调试
摘要:IE Javascript 进阶调试大多数人用IE都知道IE有个F12 开发者工具可以用来调试网页的各种问题,本文以IE10为例,尽量少谈基础,只说说IE脚本调试中比较常用的技巧。如果你的网页脚本在IE上运行出现问题,希望下面的技巧可以帮你省点时间。目录看控制台输出(console output)查看元素事件格式化脚本启用异常断点文档模式(document mode)Visual Studio调试IE网页FiddlerJSLintJSFiddleQuirks Mode内存泄露看控制台输出(console output)如果说你发现网页有什么功能不工作,第一步要做什么?我建议先查看控制台输出。很 阅读全文
-
js中getByClass()函数
摘要:js中getByClass()函数进化史对于js来说,我想每一个刚接触它的人都应该会抱怨:为什么没有一个通过class来获取元素的方法。尽管现在高版本的浏览器已经支持getElementsByClassName()方法,但是对于低版本浏览器来说,还是无法兼容,在脱离其他库的时候,还是得自己封装一个方法。也可到独立博客查看:getByClass()函数进化史下面列举几种网上常见的方法并说明存在的一些问题。方法一function getByClass1(oParent, sClass){ var aRes = []; //存放匹配结果的数组 var aEle = oParent.ge... 阅读全文
-
Jquery多级菜单插件Slimmenu使用说明
摘要:Jquery多级菜单插件Slimmenu使用说明现在扁平化设计逐渐的成为了趋势,不管是pc web,还是移动互联网的应用开发,都在研究和设计Flat ui,这里有一篇文章说明扁平化的设计的一些想法:[jquery mobile扁平化设计样式--Jquery mobile Flat UI介绍]今天分享几个Jquery的扁平化插件。首先是Jquery 扁平化菜单:SlimMenu。无图无真像。先上图。样式我做了部分修改。SlimMenu支持的功能有:轻量级,css+js(压缩后),10k左右。支持响应式设计。自适应屏幕 3. 支持多级菜单预计为将来的功能开发中,会更好的支持mobile版本。测试通 阅读全文
-
bootstrap插件学习-bootstrap.typehead.js
摘要:bootstrap插件学习-bootstrap.typehead.js先看bootstrap.typehead.js的结构var Typeahead = function ( element, options ){} //构造器Typeahead.prototype = {} //构造器的原型$.fn.typeahead = function ( option ){} //jQuery原型上自定义方法$.fn.typeahead.defaults ={} //默认参数$.fn.typeahead.Constructor = Typeahead //重写jQuery原型上的自定义方法的构造器名$ 阅读全文
-
jQuery LigerUI V1.2.2
摘要:jQuery LigerUI V1.2.2 (包括API和全部源码) 发布前言 这次版本主要对树进行了加载性能上面的优化,并解决了部分兼容性的问题,添加了几个功能点。 欢迎使用反馈。相关链接API: http://api.ligerui.com/ 演示地址: http://demo.ligerui.com/ 源码下载: http://git.oschina.net/ligerui/LigerUI/(源码托管) http://pan.baidu.com/share/link?shareid=206890659&uk=2318736180(V1.2.2) 技术支持:http://w... 阅读全文
-
JavaScript创建对象
摘要:JavaScript创建对象JavaScript 有Date、Array、String等这样的内置对象,功能强大使用简单,人见人爱,但在处理一些复杂的逻辑的时候,内置对象就很无力了,往往需要开发者自定义对象。对象是什么从JavaScript定义上讲对象是无序属性的集合,其属性可以包含基本值、对象或函数。也就是说对象是一组没有特定顺序的属性,每个属性会映射到一个值上,是一组键值对,值可以是数据或对象。最简单的对象JavaScript的一对花括号{}就可以定义一个对象,这样的写法实际上和调用Object的构造函数一样var obj={};var obj2=new Object();这样构建出来的对 阅读全文
-
几款JS地图插件比较
摘要:几款JS地图插件比较因工作需要,最近研究几款关于地图的JS插件,现与大家分享一下。以下比较只是浅层次的分析一下,并没有实际通过项目检验,所以不足之处还请大家指出。地图插件对比插件名简介区域支持扩展性离线支持多浏览器支持优点缺点jVectorMap国外一款显示矢量地图的jQuery插件。世界、全国、省弱支持好使用相对简单。只支持到省级划分,不支持市级。加载速度快。样式、显示效果不理想。多浏览器支持较好。仅有基本的显示功能,若要完成复杂交互,需改源码。 扩展性不强。Echarts国内一款开源插件,来自百度商业前端数据可视化团队,基于html5 Canvas,是一个纯Javascript图表库。中国 阅读全文
-
图片惰性加载
摘要:手机网站实现图片惰性加载什么是图片惰性加载呢?顾名思义,惰性指的是我们只将用户视野范围内(浏览器窗口的可视区域)的图片加载,而用户视野范围外的图片先不加载,当用户看到这些图片时再做加载。这样做的好处在于哪里呢?1、用户访问速度上升了,浏览器的加载进度条很快就加载完毕。2、节省用户流量。那么如何实现呢?我们需要解决两个问题:① 如何知道用户是否能看见这张图片?②如何让看不到的图片不加载,而在需要的时候再去加载?先解决第一个问题:如何知道用户是否能看见这张图片?首先需要获取三个值,这些都可以通过javascript获取。①浏览器窗口的高度windowHeight②页面滚动的距离 windowPa. 阅读全文
-
谈谈Javascript的this关键字(this is not this)
摘要:谈谈Javascript的this关键字(this is not this)前言: 看文章标题你就知道,这篇文章我只讲一个简单的Javascript的this关键字,说它简单——它又不简单,因为曾几何时我也对this关键字有些困惑,它也确实会让不少程序员感到不解——它像是一个身份多变的“指针”,有时仅看代码都很难分辨出其当前所指向的对象;恰好这两天我突然想到应该写篇关于Javascript方面的博客,也算是为以后的公司技术培训做点儿准备。这篇文章,我可能更倾向于,用代码来直接的体现我要描述的内容。好的文章不在于它的篇幅长、内容丰富,而在于或者说更重要的是——应该用言简意赅的内容让读者快速... 阅读全文
-
bootstrap插件学习-bootstrap.carousel.js
摘要:bootstrap插件学习-bootstrap.carousel.js先看bootstrap.carousel.js的结构var Carousel = function (element, options){} //构造器Carousel.prototype = {} // 构造器原型$.fn.carousel = function ( option ) {} //jQuery原型上自定义的方法$.fn.carousel.defaults ={} //默认参数$.fn.carousel.Constructor = Carousel // 重写jQuery原型上自定义方法的构造器名$(funct 阅读全文
-
ExtJs布局详解
摘要:ExtJs布局详解序言 1、百度百科上说:ExtJs功能丰富,无人能出其右。无论是界面之美,还是功能之强,extjs都高居榜首。 2、呵呵,界面之美当是少不了布局的,这篇文章我写layout的七种布局。(extjs是4.+版本)Border布局__边界布局这中布局是最常用的布局之一,看图 border布局:border布局也称边界布局,他将页面分隔为west,east,south,north,center这五个部分,我们需要在其items中指定使用region参数为其子元素指定具体位置。 注意:north和south部分只能设置高度(height),west和east部分只能设置宽... 阅读全文
-
JavaScript prototype
摘要:JavaScript prototype用过JavaScript的同学们肯定都对prototype如雷贯耳,但是这究竟是个什么东西却让初学者莫衷一是,只知道函数都会有一个prototype属性,可以为其添加函数供实例访问,其它的就不清楚了,最近看了一些 JavaScript高级程序设计,终于揭开了其神秘面纱。每个函数都有一个prototype属性,这个属性是指向一个对象的引用,这个对象称为原型对象,原型对象包含函数实例共享的方法和属性,也就是说将函数用作构造函数调用(使用new操作符调用)的时候,新创建的对象会从原型对象上继承属性和方法。私有变量、函数在具体说prototype前说几个相关的东 阅读全文
-
ExtJs控件属性配置详细
摘要:ExtJs控件属性配置详细序言: 1.本文摘自网络,看控件命名像是4.0以前的版本,但控件属性配置仍然可以借鉴(不足之处,以后项目用到时再续完善)。Ext.form.TimeField:配置项: maxValue:列表中允许的最大时间 maxText:当时间大于最大值时的错误提示信息 minValue:列表中允许的最小时间 minText:当时间小于最小值时的错误提示信息 increment:两个相邻选项间的时间间隔,默认为15分钟 format:显示格式,默认为“g:i A”。一般使用“H:i:s” H:带前缀0的24小时 i:带前缀0的分钟 s:带前缀0的秒 invalidT... 阅读全文
-
bootstrap插件学习-bootstrap.collapse.js
摘要:bootstrap插件学习-bootstrap.collapse.js先看bootstrap.collapse.js的结构var Collapse = function ( element, options ){} // 构造器Collapse.prototype = {} //构造器的原型$.fn.collapse = function ( option ){} //jQuery原型上自定义的方法$.fn.collapse.defaults = {} // 默认参数$.fn.collapse.Constructor = Collapse // 重写jQuery原型自定义方法的构造器名$(fu 阅读全文
-
JS兼容性问题(FF与IE)
摘要:JS兼容性问题(FF与IE)不同浏览器中js兼容问题大全1.document.formName.item('itemName')问题说明:1 //IE下(两种)2 document.formName.item("itemName");3 document.formName.elements ["elementName"];4 //Firefox下5 document.formName.elements["elementName"];6 //解决方法:7 document.formName.elements[" 阅读全文
-
new关键字
摘要:Javascript的实例化与继承:请停止使用new关键字本文同时也发表在我另一篇独立博客《Javascript的实例化与继承:请停止使用new关键字》(管理员请注意!这两个都是我自己的原创博客!不要踢出首页!不是转载!已经误会三次了!)标题当然是有一点耸人听闻了,但个人觉得使用new关键字确实并非是一个最佳的实践。换句话说,我觉得有更好的实践,让实例化和继承的工作在javascript更友好一些,本文所做的工作就是教你对new关联的操作进行一系列封装,甚至完全抛弃new关键字。在阅读本文之前你必须要对javascript中关于prototype,constructor, 以及如何实现面向对象 阅读全文