jQuery链式操作
讨论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链式操作的更多相关文章
- JQUERY链式操作实例分析
本文实例讲述了jQuery链式操作.分享给大家供大家参考,具体如下: 从过去的实例中,我们知道jQuery语句可以链接在一起,这不仅可以缩短代码长度,而且很多时候可以实现特殊的效果. <scri ...
- jQuery链式操作[转]
用过jQuery的朋友都知道他强大的链式操作,方便,简洁,易于理解,如下 $("has_children").click(function(){ $(this).addClass( ...
- jQuery链式操作如何返回上一级DOM
有时候我们在链式操作的时候,选择到了其他的DOM进行操作,如何再返回先前的dom呢,有一下几个方法,end(); addBack(); add(); 使用形式 $("#divFather&q ...
- 强大的JQuery链式操作风格
实例代码 <style type="text/css"> #menu {width: 300px;} .has_children {background:#555;co ...
- 如何一行jquery代码写出tab标签页(链式操作)
啦啦!今天又学了一招,js写几十行的tab标签页jquery写一行就行啦,用到了链式操作!以下是代码: <!DOCTYPE html> <html lang="en&quo ...
- jquery中链式操作的this指向
jquery中链式操作是如何实现? 例如:$(obj).children().css('color','red').next().css('color','red').siblings().css(' ...
- jQuery对象的链式操作用法分析
可以使用下面的原则判断一个函数返回的时候是jQuery对象,即是否可以用于链式操作. 除了获取某些数据的函数,比如获取属性值"attr(name)",获取集合大小"siz ...
- PHP链式操作输出excel(csv)
工作中经常会遇到产品运营让导出一些简单的比较规范的数据,这时候要是有一个简单的方法可以用就简单多了.下面是我的一个输出简单的excel(csv)的方法类,用到了链式操作.说到链式操作,在jquery中 ...
- js实现链式操作
前言:前不久阿里远程面试时问了我一个问题,如下: function Person(){}; var person = new Person(); //实现person.set(10).get()返回2 ...
随机推荐
- MyEclipse 点击 部署 按钮 无效的解决办法
问题描述 1 通常情况下,当我们点击MyEclipse任务栏上的部署按钮时,会弹出项目部署框,如下图: 2 但我们有时也会遇到点击部署按钮怎么也弹不出项目部署框的问题. END 解决方法一: 1 ...
- ural 1613 For Fans of Statistics
#include <cstdio> #include <cstring> #include <map> #include <vector> #inclu ...
- JBOSS尝鲜
环境搭建:1. jdk-6u16-windows-i586.exe2. jboss-5.1.0.GA-jdk6.zip JDK安装: 安装过程很简单,应该都知道怎么安装软件....安装完JDK后,需要 ...
- 10 001st prime number
这真是一个耗CPU的运算,怪不得现在因式分解和素数查找现在都用于加密运算. By listing the first six prime numbers: 2, 3, 5, 7, 11, and 13 ...
- Android中的PopupWindow的使用
PopupWindow 需要一个自定义的布局文件 列如:popupwindow.xml <?xml version="1.0" encoding="utf-8&qu ...
- java与数据结构(4)---java实现双向循环链表
线性表之链式存储结构双向循环链表 双向循环链表:每个结点包含了数据.直接前驱地址指针和直接后驱地址指针,头结点的直接前驱指向尾结点,尾结点的直接后驱指向头结点,头尾相连构成一个可正可反的圆环.可以形象 ...
- solr索引
solr索引 当我们真正进入到Lucene源代码之中的时候,我们会发现: • Lucene的索引过程,就是按照全文检索的基本过程,将倒排表写成此文件格式的过程. • Lucene的搜索过程,就是按照此 ...
- JS浏览器对象-Location对象
1.返回web主机的域名 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> ...
- ORACLE STUDY NOTES 02
[JSU]LJDragon's Oracle course notes In the first semester, junior year I.用户和权限 1.用户操作 --创建新用户 CREATE ...
- final(最终、修饰符)
/* final(最终.修饰符) final关键字的用法: 1. final关键字修饰一个基本类型的变量时,该变量不能重新赋值,第一次的值为最终的. 2. fianl关键字修饰一个引用类型变量时,该变 ...