jQuery中形如$("#txtName").addClass("err").css("font-size","12px").select().focus();的方式让人不得不为之着迷。其实现机制就是链式调用。链式调用就是调用对象的方法后返回到该对象,严格来讲它并不属于语法,而只是一种语法技巧,js令人着迷的一点就是这里。 没有返回值的方法属于赋值器方法,显然它很容易实现链式调用,前提是正确理解this指针的用法。 代码如下: function W(){ this.name="Wang Hongjian"; this.gender="...
Javascript链式调用 function ele(){ this.elements=[]; var element; if(typeof arguments[0]=="string"){ element=arguments[0]; if (element.slice(0, 1) == '#') { element = document.getElementById(element.slice(1)); this.elements.push(element); }else if(element.slice(0,1)=='.'){ element=element.slice(1); var es = document.body.getElementsByTagName('*'); for (var i = 0, j = es.length; i $('.t...
话说回来,虽然jQuery让学习前端技术的越来越多了起来,(本人就是因为学校图书馆偶然间遇到了一本jQuery基础教程(二)开始想深入的学习前端技术),关于jQuery的博文甚至多于javascript,它让编程的门槛大大的降低了,但是它隐藏了太多细节了,形如$('#id').append('xxx').clone().appendTo(x).end().css(...)................这样操作的模式已经很难找到常规javascript的影子。浏览器的差异仿佛一去就不见了踪影,我不认为大部分...
jQuery式的方法链核心部分是三点: 1)jquery的包装器函数(也就是jQuery(),以此来构建包装器对象),以此构造函数可以产生饱含了原生DOM对象的包装器对象。 它大概是这个样子的…(当然跟官方库的规模跟功能以及实现方式都差很多,我只是写了个大概的实现方式): 呃…………我的失误,请大家如果有兴趣尝试下代码记得不要引入jQuery库,命名冲突了 代码如下: (function(){ //简化起见不支持子类选择器属性选择器等等,只接受形如".cla...
一、方法体内返回对象实例自身(this) 代码如下: function ClassA(){ this.prop1 = null; this.prop2 = null; this.prop3 = null; } ClassA.prototype = { method1 : function(p1){ this.prop1 = p1; return this; }, method2 : function(p2){ this.prop2 = p2; return this; }, method3 : function(p3){ this.prop3 = p3; return this; } } 定义了function/类ClassA。有三个属性/字段prop1,prop2,prop3,三个方法methed1,method2...
一、对象链:方法体内返回对象实例自身(this) 代码如下: function ClassA(){ this.prop1 = null; this.prop2 = null; this.prop3 = null; } ClassA.prototype = { method1 : function(p1){ this.prop1 = p1; return this; }, method2 : function(p2){ this.prop2 = p2; return this; }, method3 : function(p3){ this.prop3 = p3; return this; } } 定义了function/类ClassA。有三个属性/字段prop1,prop2,prop3,三个方法methed1...
链式调用 链式调用其实只不过是一种语法招数。它能让你通过重用一个初始操作来达到用少量代码表达复杂操作的目的。该技术包括两个部分: 一个创建代表HTML元素的对象的工厂。 一批对这个HTML元素执行某些操作的方法。 调用链的结构$函数负责创建支持链式调用的对象代码如下:(function() { /* * 创建一个私有class * @param {Object} els arguments 所有参数组成的类数组 */ function _$(els) { this....
认真研究了一会DSL,发现了这么几件有趣的事,JavaScript用得最多的一个东西怕是链式调用 (方法链,即Method Chaining)。 有意思的是Martin Flower指出:代码如下:Ive also noticed a common misconception - many people seem to equate fluent interfaces with Method Chaining. Certainly chaining is a common technique to use with fluent interfaces, but true fluency is much more than that.很多人将链式调用等同于流畅接...
上篇文章给大家介绍了jQuery的框架,有关jquery的基础知识可以参考下。 jQuery使用许久了,但是有一些API的实现实在想不通。下面将使用简化的代码来介绍,主要关注jQuery的实现思想。相较于上一篇,代码更新了:21~78(function(window, undefined){ function jQuery(sel){ return new jQuery.prototype.init(sel); } jQuery.prototype = { constructor: jQuery, init: function(sel){ if(typeof sel === 'string'){ var that = thi...
本文实例讲述了JQuery特殊效果和链式调用操作。分享给大家供大家参考,具体如下: JQuery的特殊效果fadeOut()淡入 fadeToggle()切换淡入淡出 hide() 隐藏元素 show() 现实元素 toggle() 切换元素的可见状态 slideDown() 向下展开 slideUp() 向上卷起 slideToggle()依次展开或者卷起某个元素<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>Title</title><style type="text/css">.box{width: 300px;height: 3...
本文实例讲述了JavaScript的级联函数用法。分享给大家供大家参考,具体如下: 级联函数 级联函数就是在对象调用中通过点的方式串联调用,在jQuery中就是链式调用, 其关键点就是在内部 return this 返回自身 应用 function Person() {this.name = ;this.age = 0;this.weight = 10; } Person.prototype = {setName:function(name){this.name = name;return this;},setAge:function(age){this.age = age;return this;},setWeight:func...
本文实例分析了JavaScript链式调用。分享给大家供大家参考,具体如下: 对$函数你已经很熟悉了。它通常返回一个html元素或一个html元素的集合,如下: function$(){var elements = [];for(vari=0,len=arguments.length;i<len;++i){var element = arguments[i];if(typeof element ===”string”){element = document.getElementById(element);}if(arguments.length==1){return element;}elements.push(element);}return elements; }...
本文实例讲述了javascript简单链式调用方法。分享给大家供大家参考,具体如下: jQuery用的就是链式调用。像一条连接一样调用方法。 链式调用的核心就是return this;,每个方法都返回对象本身。 下面是简单的模拟jQuery的代码: <script>window.$ = function (id) {return new _$(id);}function _$(id) {this.elements = document.getElementById(id);}_$.prototype = {constructor: _$,hide: function () {console.log(hide);retur...
介绍 所谓Promise,简单来说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果。 缺少场景支撑,对于新手而言,很难理解Promise的意义。 在《你不知道的JavaScript中》有个场景介绍得很形象: 我走到快餐店的柜台,点了一个芝士汉堡。我交给收银员1.47美元。通过下订单并付款,我已经发出了一个对某个值(就是那个汉堡)的请求。我已经启 动了一次交易。但是,通常我不能马上就得到这个汉堡。收银员会交...
上篇文章给大家介绍了jQuery的框架,有关jquery的基础知识可以参考下。 jQuery使用许久了,但是有一些API的实现实在想不通。下面将使用简化的代码来介绍,主要关注jQuery的实现思想。相较于上一篇,代码更新了:21~78(function(window, undefined){ function jQuery(sel){ return new jQuery.prototype.init(sel); } jQuery.prototype = { constructor: jQuery, init: function(sel){ if(typeof sel === string){ var that = this;...