js链式调用

最开始接触到链式调用是在jQuery库中,代码应该是这样:

js链式调用
1 $("#target").css("width","200px").css("color","red");
View Code

在一条链中,既设置了width,又设置了字体颜色,仅仅需要一行代码。

除了行数比两行代码少之外,找到#target对象也需要一次(如果写成两行,那么需要在DOM中找#target两次),链式调用的优势就在这里。

需要了解的是,每一个链结返回的仍然是目标对象,所以才可以作为调用者继续调用下一个链结。

因此,需要注意的是,链式调用中的链结必须要返回调用对象本身,否则,链结可能会断掉。

比如:

js链式调用
$("#target").css("width").css("color","red")
View Code

控制台会报错,说Object ***没有css方法。

因为css("width")返回的是元素的像素(string格式),这在jquery中应该叫getter,即获取;而css("width","200px")叫setter,即设置。链结应该都是setter,除了链尾可以使用getter,当然前提是不需要返回值为调用者本身。

js链式调用,布布扣,bubuko.com

js链式调用

上一篇:ASP.NET MVC5 网站开发实践(二) Member区域 - 文章管理 - 架构


下一篇:jQuery源码学习(6) - 一个正则