随笔分类 - [10]JS
-
bootstrap + angularjs + seajs构建Web Form前端(1)
摘要:bootstrap + angularjs + seajs构建Web Form前端(一)简介 Bootstrap是Twitter推出的一个用于前端开发的开源工具包,它由Twitter的设计师Mark Otto和Jacob Thornton合作开,是一个CSS/HTML框架。 AngularJS是Google 开源出来的一套 js 工具,为了克服HTML在构建应用上的不足而设计的,试图成为WEB应用中的一种端对端的解决方案,通过为开发者呈现一个更高层次的抽象来简化应用的开发,后面简称"ng"。 Seajs是一款优秀的模块开发插件,可以实现按需加载。 Bootstrap有自己的 阅读全文
-
jQuery插件开发
摘要:jQuery插件开发精品教程,让你的jQuery提升一个台阶要说jQuery 最成功的地方,我认为是它的可扩展性吸引了众多开发者为其开发插件,从而建立起了一个生态系统。这好比大公司们争相做平台一样,得平台者得天下。苹果,微软,谷歌等巨头,都有各自的平台及生态圈。学会使用jQuery并不难,因为它简单易学,并且相信你接触jQuery后肯定也使用或熟悉了不少其插件。如果要将能力上升一个台阶,编写一个属于自己的插件是个不错的选择。本教程可能不是最精品的,但一定是最细致的。jQuery插件开发模式软件开发过程中是需要一定的设计模式来指导开发的,有了模式,我们就能更好地组织我们的代码,并且从这些前人总结 阅读全文
-
javascript变量的作用域
摘要:javascript变量的作用域不太会写冠冕堂皇的开场白,直接进入主题。我们看一道题,出处为javaeye的某贴——这世界就是这样,有些人喜欢制造问题,有人喜欢解决问题。制造问题的人为解决问题的人带来就业机会……var a=100; var b=true; function test(){ alert(a); alert(b); b=false; alert(b); var a=200; alert(a/2); alert(++Math.PI); alert(Math.PI++); } test();运行代... 阅读全文
-
jsoneditor显示Json data
摘要:Git开源地址:https://github.com/josdejong/jsoneditor/blob/master/docs/api.md1.引用JS文件2.显示Json数据 Model内容 3.JS 方法 阅读全文
-
Js模块模式
摘要:模块模式索引引子什么是模块模式命名空间模式声明依赖私有和特权成员即时函数揭示模块模式结语引子这篇算是对第9篇中内容的发散和补充,当时我只是把模块模式中的一些内容简单的归为函数篇中去,在北川的提醒下,我才发觉这是非常不严谨的,于是我把这些内容拎出来,这就是这篇的由来。什么是模块模式在JavaScript中没有包(Package)的概念,而面对日益庞大的JavaScript代码,而这正促使模块化开发的迫切需求,所以也就诞生了JavaScript的模块模式, 最早这么叫的是老道,他称之为 模块模式 (Module Patterns).模块模式提供了用于创建独立解耦的代码片段的工具,这些代码可以被当成 阅读全文
-
angular + easyui 做界面验证
摘要:angular + easyui 做界面验证 angular结合easyui这事其实并不是很合适,因为:angular的特点之一是双向绑定,页面元素与页面逻辑之间解耦;easyui是对页面元素进行封装,甚至一些组件是隐藏了原本的dom元素,初始化时创建新的元素来实现功能的。在某种程度上来说,angular和easyui在工作原理上是冲突的,当然,下面就是但是了,不然就不太好往下写了。 但是,easyui的验证控件validatebox的验证控件提示明显,UI效果比较友好,而且不会影响angular的正常工作,所以我对用这两个结合做验证非常喜欢。 好了,正式开始,首先添加引用:然后是页面元素,只 阅读全文
-
图片轮播插件Nivo Slider
摘要:推荐:图片轮播插件Nivo Slider 因为项目需要一款切换样式多一些的轮播插件,不经意找到了NivoSlider,非常好用,比bootstrap要好用,而且样式丰富。值得注意的是,这款插件是在MIT协议下免费的。 Demo地址:http://demo.dev7studios.com/nivo-slider/ 一、起步 1.最简单写法。 这样会生成随机轮播的效果图。而且大小图切换平缓。 ... 阅读全文
-
jQuery基础知识
摘要:一周一话题之四(JavaScript、Dom、jQuery全面复习总结)-->目录导航一、 初探Jquery1. 介绍2. 基础二、 Jquery操作1. jQuery页面加载2. 选择器3. 操作Dom三、 Jquery进阶1. 隐式迭代与链式编程2. RadioButton操作3. 事件4. 动画5. jQuery 插件6. Ajax四、 Jquery练习一、 初探Jquery在BS系统开发中,Jquery的使用更加是少不了的,通过本文我们来复习一下Jquery的知识,达到温故而知新的目的。1. 介绍jQuery就是JavaScript语法写的一些函数类,内部仍然是调用JavaScr 阅读全文
-
jsonp跨域+ashx
摘要:jsonp跨域+ashx(示例)前言 做B/S项目的时候,我们一般使用jquery+ashx来实现异步的一些操作,比如后台获取一些数据到前台,但是如果ashx文件不在本项目下,引用的是别的域下的文件,这时候就访问不了。关于jsonp其实是老生常谈的话题,园中也有不少文章介绍,可以把jsonp看成一个协议或模式,这边就不多说,我们只看示例。正常实现 我们先看下代码: 1 public void ProcessRequest(HttpContext context) 2 { 3 string type = context.Request.... 阅读全文
-
javascript设计模式系列
摘要:javascript设计模式系列创建型:1.抽象工厂模式(Abstract Factory)2.构建者模式(Builder)3.工厂方法模式(Factory Method)4.原型模式(Prototype)5.单例模式(Singleton)结构型:1.适配器模式(Adapter)2.桥接模式(Bridge)3.组合模式(Compositor)4.装饰者模式(Decorator)5.外观模式(Facade)6.享元模式(Flyweight)7.代理模式(Proxy)行为:1.职责链模式(Chain of Responsibility)2.命令模式(Command)3.解释器模式(Interpre 阅读全文
-
Ajax运用总结B
摘要:Jquery重新学习之八[Ajax运用总结B]上一篇简单介绍普通javascript以及Jquery的AJAX方法,其中Jquery.ajax()是功能比较强悍的底层方法,可以更多地关注实现过程中的细节;除Jquery.ajax()方法外,Jquery还提供其它几个比较简单但作用有限的方法;包含Jquery全局函数Jquery.get()、Jquery.post()、Jquery.getJSON()、Jquery.getScript()和load()方法;1:Jquery.get(url,[data],[callback],[type]) 通过远程HTTP GET请求载入信息,简单的GET请求 阅读全文
-
javascript继承之借用构造函数与原型
摘要:javascript继承之借用构造函数与原型 在js中,关于继承只有利用构造函数和原型链两种来现实。以前所见到的种种方法与模式,只不过是变种罢了。借用构造函数123456789101112131415161718192021// 一个动物类,包含名字和性别属性functionAnimal (name, sex) {this.name = name;this.sex = sex; this.getName = function(){ returnthis.name; }; }// Cat类继承Animal基类,并且拥有额外的属性functionCat (name, sex, hasLegs) { 阅读全文
-
在Visual Studio上开发Node.js程序
摘要:在Visual Studio上开发Node.js程序【题外话】最近准备用Node.js做些东西,于是找找看能否有Visual Studio上的插件以方便开发。结果还真找到了一个,来自微软的Node.js Tools for Visual Studio(NTVS),虽然现在仅发布了1.0 Alpha版本,但使用起来已经非常方便。而且,其开发团队与Python Tools for Visual Studio(PTVS)是同一个,而PTVS就是Visual Studio 2013中要创建自带的Python项目需要安装的那个程序,所以大可放心的使用NTVS。【文章索引】NTVS介绍与安装NTVS项目创 阅读全文
-
JS逗号、冒号与括号
摘要:JavaScript面试时候的坑洼沟洄——逗号、冒号与括号看完了javaScript数据类型和表达式与运算符相关知识后以为可以对JavaScript笔试题牛刀小试一把了,没想到有一次次的死在逗号,冒号和括号上,不得已再看看这几个符号吧。逗号逗号我们常见的用法就是在连续声明一些变量的时候,可以少些很多var123vara=1,b=2,c=3;方法参数我们使用逗号隔开,对象属性也是逗号隔开``` function fbn(name,title){} var person={ name:"Byron", age:"24" }; ``` 然而我们也会遇到这样的问 阅读全文
-
JavaScript里的依赖注入
摘要:JavaScript里的依赖注入我喜欢引用这句话,“程序是对复杂性的管理”。计算机世界是一个巨大的抽象建筑群。我们简单的包装一些东西然后发布新工具,周而复始。现在思考下,你所使用的语言包括的一些内建的抽象函数或是低级操作符。这在JavaScript里是一样的。迟早你需要用到其他开发人员的抽象成果——即你依靠别人的代码。我喜欢依赖自由(无依赖)的模块,但那是难以实现的。甚至你创建的那些漂亮的黑盒子组件也或多或少会依赖一些东西。这正是依赖注入大显身手的之处。现在有效地管理依赖的能力是绝对必要的。本文总结了我对问题探索和一些的解决方案。目标设想我们有两个模块。第一个是负责Ajax请求服务(servi 阅读全文
-
定制你自己的jQuery
摘要:如何定制你自己的jQueryjQuery随着版本的不断升级代码量也随之增加,从1.0.0的不到两千行到现在的1.10.2已经突破1万行。新的API不断增加,但有些在项目中并没有用到。jQuery团队很早就考虑到这一点,按模块来划分,并可以按需定制自己的jQuery。jQuery从1.9开始构建工具迁移到grunt。grunt是基于node的,因此需要安装node,下面详细介绍。一、安装node很简单,这里有入门参考。二、安装grunt也很简单,这里有入门参考。三、去github下载jQuery源码使用命令:git clone git://github.com/jquery/jquery.git 阅读全文
-
JS列表的下拉菜单组件(仿美化控件select)
摘要:JS列表的下拉菜单组件(仿美化控件select)2014-01-23 23:51 by 龙恩0707,1101阅读,6评论,收藏,编辑今天是农历23 也是小年,在这祝福大家新年快乐!今天给大家分享的是:JS列表的下拉菜单组件,因为目前项目正好要用到这个,所以提前研究了下,看到KISSY也有这么一个组件,所以自己也封装了一个,KISSYdemo链接KISSY组件名字叫 "一个解决大数据列表渲染效率的下拉菜单组件。", 他对这个组件做了一次小优化。(假如服务器返回10000条数据或者更多的话,那么我们前端一次性操作10000条数据的话很会影响性能,他们做的优化是:将数组拆分,根 阅读全文
-
javascript中的继承
摘要:【一次面试感悟】再谈javascript中的继承前言实现继承prototype实现继承简化prototype继承实战继承结语前言面向对象编程是每次面试必问的知识点,而前端js如何实现继承每次命中率高达80%这不,近两天我们面试时候,同事就问道面试者此问题,但是,不论之前自己做的回答,还是面试者的回答,基本都不太令人满意很大的原因是多数时候前端并不需要实现继承,就jquery来说也基本上是一码到底,没有实现继承,据我所知,也就prototype与ext实现过继承所以继承对前端来说似乎不太适用近两年来情况有所变化,SPA的兴起以及前端逻辑的复杂化,让前端代码愈发的多,愈发的重,所以继承慢慢的进入了 阅读全文
-
r.js实践
摘要:r.js合并实践项目中用到require.js做生产时模块开发,但上线要合并压缩,幸好它配套有r.js。下面就其用法说明一下。首先建一个目录,里面的结构如下:require.js可以到r.js项目下载r.js可以到r.js项目下载server.exe可以到avalon项目下载jquery可以到JQ官网下载avalon.js可以到avalon项目下载,并把里面的loader: true改为loader: false,禁止自带的加载器。main.js是用于配置加载选项的,如shim机制,有时还做一些初始化操作。build.js是用于合并压缩的。index.html的内容如下: ... 阅读全文
-
javascript-无间缝滚动,封装
摘要:原生javascript-无间缝滚动,封装目前支持的是竖向与横向滚动http://lgyweb.com/marScroll/现在分析下无间缝实现的基本思路(竖向例子):HTML结构:1 2 3 014 025 036 047 058 9 CSS:1 (1)首先需要判断里面的内容高度ul结构是否高于外层div#marScrolll,则才进行无间缝滚动: // 写在匿名函数里面,防止全局变量污染 (function(){ ... 阅读全文