讨论jQuery的文章很多。然而,关于jQuery的链式操作的文章并无多少。好的代码会带来速度的提升。快速渲染和响应意味着更好的用户体验。

下面就来讲讲jQuery的链式操作。

很多时候我们写代码的时候会这样去写:

$("div").css("background","#eee")
$("div").text("关注前端,关注用户体验-冀");

这重复的去获取DIV这个节点非常影响性能,这时你可能会想到这样去写:

var div = $("div")
div.css("background","#eee")
div.text("关注前端,关注用户体验-冀");

不错,这样写也对,也是优化了重复去寻找节点。但是有没有更为简便的方法去写代码呢?

答案就在jQuery链式操作,这是个非常好的减少代码的书写方式,也去优化了性能方面的问题。

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
<title></title>
<style type="text/css">
div{
width: 200px;
height: 200px;
border: 1px solid saddlebrown;
}
</style>
</head>
<body>

<div></div>

<script type="text/javascript" src="jquery-1.7.1.min.js"></script>
<script type="text/javascript">
$("div").css("background","#eee").text("关注前端,关注用户体验-冀");
</script>
</body>
</html>

实现的原理就是在对象上的方法加上

return this

这样的方式简单明了,一行代码解决,好的代码就是这样的产生的,关注好的代码,关注好的代码速写,请关注我。

jQuery链式操作的更多相关文章

  1. JQUERY链式操作实例分析

    本文实例讲述了jQuery链式操作.分享给大家供大家参考,具体如下: 从过去的实例中,我们知道jQuery语句可以链接在一起,这不仅可以缩短代码长度,而且很多时候可以实现特殊的效果. <scri ...

  2. jQuery链式操作[转]

    用过jQuery的朋友都知道他强大的链式操作,方便,简洁,易于理解,如下 $("has_children").click(function(){ $(this).addClass( ...

  3. jQuery链式操作如何返回上一级DOM

    有时候我们在链式操作的时候,选择到了其他的DOM进行操作,如何再返回先前的dom呢,有一下几个方法,end(); addBack(); add(); 使用形式 $("#divFather&q ...

  4. 强大的JQuery链式操作风格

    实例代码 <style type="text/css"> #menu {width: 300px;} .has_children {background:#555;co ...

  5. 如何一行jquery代码写出tab标签页(链式操作)

    啦啦!今天又学了一招,js写几十行的tab标签页jquery写一行就行啦,用到了链式操作!以下是代码: <!DOCTYPE html> <html lang="en&quo ...

  6. jquery中链式操作的this指向

    jquery中链式操作是如何实现? 例如:$(obj).children().css('color','red').next().css('color','red').siblings().css(' ...

  7. jQuery对象的链式操作用法分析

    可以使用下面的原则判断一个函数返回的时候是jQuery对象,即是否可以用于链式操作. 除了获取某些数据的函数,比如获取属性值"attr(name)",获取集合大小"siz ...

  8. PHP链式操作输出excel(csv)

    工作中经常会遇到产品运营让导出一些简单的比较规范的数据,这时候要是有一个简单的方法可以用就简单多了.下面是我的一个输出简单的excel(csv)的方法类,用到了链式操作.说到链式操作,在jquery中 ...

  9. js实现链式操作

    前言:前不久阿里远程面试时问了我一个问题,如下: function Person(){}; var person = new Person(); //实现person.set(10).get()返回2 ...

随机推荐

  1. [转] c#多线程(UI线程,控件显示更新) Invoke和BeginInvoke 区别

    如果只是直接使用子线程访问UI控件,直接看内容三,如果想深入了解从内容一看起. 一.Control.Invoke和BeginInvoke方法的区别 先上总结: Control.Invoke 方法 (D ...

  2. 使用hexo创建github博客

    前言 前面说过,之前用wordpress辛辛苦苦搭建的博客,因为服务器和域名的问题挂掉了.后来发现github也能够搭建自己的博客,不需要去关心主机域名的问题,而且还能使用Markdown来写博客,就 ...

  3. PHP 类中的常量

    类中的常量与静态成员类似他们只属于类而不属于类的任何实例,访问形式与访问静态成员一样. 例如: <?php class MyConst{ const RED="Red"; c ...

  4. 【HDOJ】1332 LC-Display

    水题. #include <cstdio> #include <cstring> #include <cstdlib> #define MAXN 11 #defin ...

  5. Linux系统编程(30)—— socket编程之TCP/IP协议

    在世界上各地,各种各样的电脑运行着各自不同的操作系统为大家服务,这些电脑在表达同一种信息的时候所使用的方法是千差万别.就好像圣经中上帝打乱了各地人的口音,让他们无法合作一样.计算机使用者意识到,计算机 ...

  6. 【8】JAVA---地址App小软件(AddrDaoFile .class)(数据层)

    实现数据进行文件的存储和读写. 本软件也就到此结束了. 没多少可以讲的. 因为这个小软件也就8个类,主要学习的也就是一个分层思想的简单应用. package cn.hncu.addr.dao; imp ...

  7. 测试Remoting三种信道Http,Tcp,Ipc和Web Service的访问速度 (转)

    Remoting和Web Service是.net中的重要技术,都可用来实现分布式系统开发,如果是不同的平台就只能选择Web Service,但如果是同一平台,就都可以选择了.到底选择那种,当然还有访 ...

  8. zabbix discovery

    preface(见面礼): 仅扫tcp端口: netstat -tnlp|egrep -i "$1"

  9. 高性能Java解析器实现过程详解

    如果你没有指定数据或语言标准的或开源的Java解析器, 可能经常要用Java实现你自己的数据或语言解析器.或者,可能有很多解析器可选,但是要么太慢,要么太耗内存,或者没有你需要的特定功能.或者开源解析 ...

  10. 2016-05-I

    2016 年上半年软件设计师上午真题 1. VLIW 是( )的简称.A.复杂指令系统计算机 B.超大规模集成电路C.单指令流多数据流 D.超长指令字 2.主存与 Cache 的地址映射方式中,( ) ...