jQuery - 链(Chaining)】的更多相关文章

http://www.runoob.com/jquery/jquery-chaining.html jQuery - 链(Chaining) 通过 jQuery,可以把动作/方法链接在一起. Chaining 允许我们在一条语句中运行多个 jQuery 方法(在相同的元素上). jQuery 方法链接 直到现在,我们都是一次写一条 jQuery 语句(一条接着另一条). 不过,有一种名为链接(chaining)的技术,允许我们在相同的元素上运行多条 jQuery 命令,一条接着另一条. 提示: …
从前文的实例中,我们按到jQuery语句可以链接在一起,这不仅可以缩短代码长度,而且很多时候可以实现特殊的效果. <script type="text/javascript"> $(function() { $("div").addClass("css1").filter(function(index) { return index == 1 || $(this).attr("id") == "fourt…
讨论jQuery的文章很多.然而,关于jQuery的链式操作的文章并无多少.好的代码会带来速度的提升.快速渲染和响应意味着更好的用户体验. 下面就来讲讲jQuery的链式操作. 很多时候我们写代码的时候会这样去写: $("div").css("background","#eee") $("div").text("关注前端,关注用户体验-冀"); 这重复的去获取DIV这个节点非常影响性能,这时你可能会想到这样…
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"><head> <meta htt…
本文实例讲述了jQuery链式操作.分享给大家供大家参考,具体如下: 从过去的实例中,我们知道jQuery语句可以链接在一起,这不仅可以缩短代码长度,而且很多时候可以实现特殊的效果. <script type="text/javascript">   $(function() {     $("div").addClass("css1").filter(function(index) {       return index == 1…
这里讲到了一条语句运行多个JQuery方法(同一个元素)和动画100%完成后执行的callback方法. <!DOCTYPE html> <html> <head> <title>Callback方法和链的解释</title> <script type="text/javascript" src="../jquery.min.js"></script> <script type…
用过jQuery的朋友都知道他强大的链式操作,方便,简洁,易于理解,如下 $("has_children").click(function(){ $(this).addClass("highlight").children("a").show().end().siblings().removeClass("highlight").children("a").hide(); }); 1.jQuery的链式操作…
我们在使用jquery的时候会用到类似$("#id").css('color','red').show(200); 这样写有点减少代码量,减少了逐步查询DOM的性能损耗: js 原理实现: function demo(){} demo.prototype={ first:function(fir){ this.fir=fir; return this;}, second:funciton(sec){ this.sec=sec; return sec; } } var s=new dem…
一直写代码写代码,博客都快荒废了,眼看一月要过完,不能不留下点记忆,嘿嘿,刚研究了下jquery的链式访问,这么好用的技能我赶紧get了下,研究后略微修改,模拟一个简单的链式访问,下面这段代码支持修改css,获取css属性值,显示和隐藏等小功能,打算抽空把自己的js小框架全改成链式访问. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <…
Jquery中的方法基本 上都可以返回一个Jquery对象, 如: <body> <div class="divcontent"> <p>中国</p> <div class="border"> <ul class="ul"> <li></li> <li></li> <li></li> <li>…
链式编程 1.原理:return this; 2.通常情况下,只有设置操作才能把链式编程延续下去.因为获取操作的时候,会返回获取到的相应的值,无法返回 this. 3.end():结束当前链最近的一次过滤操作,并且返回匹配元素之前的状态. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title…
通过 jQuery,可以把动作/方法链接在一起. Chaining 允许我们在一条语句中运行多个 jQuery 方法(在相同的元素上). jQuery 方法链接 直到现在,我们都是一次写一条 jQuery 语句(一条接着另一条). 不过,有一种名为链接(chaining)的技术,允许我们在相同的元素上运行多条 jQuery 命令,一条接着另一条. 提示: 这样的话,浏览器就不必多次查找相同的元素. 如需链接一个动作,您只需简单地把该动作追加到之前的动作上. 下面的例子把 css().slideU…
有时候我们在链式操作的时候,选择到了其他的DOM进行操作,如何再返回先前的dom呢,有一下几个方法,end(); addBack(); add(); 使用形式 $("#divFather").show().find("a").addClass("now").end().addClass("highLight") 此段代码表示由ID为divFather往下取得了a标签加上now类之后,再返回到divFather就行添加hight…
链式编程 多行代码合并成一行代码,前提要认清此行代码返回的是不是对象.是对象才能进行链式编程 .html(‘val’).text(‘val’).css()链式编程,隐式迭代 链式编程注意:$(‘div’).html(‘设置值’).val(‘设置值’);这样可以,但是$(‘div’).html().text()这样是不对的,因为获取值时返回的是获取的字符串而不是对象本身所以不能链式编程. 案例: 页面上有一个ul球队列表当鼠标移动到某个li上的时候改行背景颜色变红,当点击某个li的时候,让该li之…
利用vs新建一个空白web项目, 再用nuget安装jQuery 1.x最新版,目前是 jQuery 1.12.4 新建一个html页面 再将jquery.js拖进新建的页面的头部 最后的html页面代码如下: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <t…
<script> var arr = function(){ return new arr.prototype.init(); } arr.prototype.init = function(){//介质 return this; } arr.prototype.ded1 = function(){ console.log(1); return this; } arr.prototype.ded2 = function(){ console.log(2); return this; } arr…
<!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> .panle { padding: 60px; background-color: red; color: #fff; font-size: 50px;…
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> .redbg{ background: pink; } </style> <script src="js/jquery-3.3.1.js" type="…
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <title></title> <scri…
链式编程 节约代码量 <button>快速</button> <button>快速</button> <button>快速</button> <button>快速</button> <button>快速</button> <button>快速</button> <button>快速</button> <script> $(fun…
实例代码 <style type="text/css"> #menu {width: 300px;} .has_children {background:#555;color:#fff;cursor:pointer;} .highlight {color:#fff;background:green;} div {padding:0px;margin:10px 0px;} div a {background:#888;display:none;float:left;width…
jQuery 效果- 隐藏hide()和显示show() 语法: $(selector).hide(speed,callback);$(selector).show(speed,callback); (可选)speed  参数:规定隐藏/显示的速度,可以取以下值:"slow"."fast" 或毫秒. (可选)callback 参数:是隐藏或显示完成后所执行的函数名称.   例1:使用 hide() 和 show() 方法来隐藏和显示 HTML 元素: <scr…
$符号的实质 //$其实就是一个函数,以后用$的时候,记得跟小括号 $(); //参数不同,功能就不同 //3种用法 //1. 参数是一个function, 入口函数 $(function () { }); console.log(typeof $); //2. $(domobj) 把dom对象转换成jquery对象 // $(document).ready(function () { // // }); //3. 参数是一个字符串,用来找对象 //$("div") $("d…
---------------------------------分割线-------------------------------------- 2017年6月7日18:16:35Query 效果jQuery 隐藏/显示jQuery 淡入淡出jQuery 滑动jQuery 动画jQuery 停止动画jQuery CallbackjQuery 链 笔记:1.jQuery 效果- 隐藏和显示隐藏.显示.切换,滑动,淡入淡出,以及动画,哇哦!2.jQuery hide() 和 show()语法:$…
jQuery 版本 2 以上不支持 IE6,7,8 浏览器.如果需要支持 IE6/7/8,那么请选择1.9你还可以通过条件注释在使用 IE6/7/8 时只包含进1.9.<!--[if lt IE 9]> <script src="jquery-1.9.0.js"></script><![endif]--><!--[if gte IE 9]><!--> <script src="jquery-2.0.…
隐藏和显示 jQuery hide() 和 show() 通过 jQuery,您可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素: jQuery toggle() 通过 jQuery,您可以使用 toggle() 方法来切换 hide() 和 show() 方法. 显示被隐藏的元素,并隐藏已显示的元素: jQuery - 链(Chaining) 通过 jQuery,可以把动作/方法链接在一起,Chaining 允许我们在一条语句中运行多个 jQuery 方法(在相同的元…
JQuery极大的提高了我们编写JavaScript的效率,让我们可以愉快的编写代码,做出各种特效.大多数情况下,我们都是使用别人开发的JQuery插件,今天我们就来看看如何把我们常用的功能做出JQuery插件,然后像使用jQuery那样来操作DOM.  一.jQuery插件开发快速上手 1.jQuery插件模板 关于jQuery插件的编写,我们可以通过为jQuery.fn增加一个新的函数来编写jQuery插件.属性的名字就是你的插件的名字,其模板如下: (function($){ $.fn.m…
<div id="ProductNet"> <table border='0' cellspacing='2' cellpadding='0' style='text-align: center; width: 674px;'> <tr> <td class='PNetTD'> 日期类型 </td> <td class='PNetTD'> 更新日期 </td> <td class='PNetTD'…
jQuery插件编写及链式编程模型小结 JQuery极大的提高了我们编写JavaScript的效率,让我们可以愉快的编写代码,做出各种特效.大多数情况下,我们都是使用别人开发的JQuery插件,今天我们就来看看如何把我们常用的功能做出JQuery插件,然后像使用jQuery那样来操作DOM.  一.jQuery插件开发快速上手 1.jQuery插件模板 关于jQuery插件的编写,我们可以通过为jQuery.fn增加一个新的函数来编写jQuery插件.属性的名字就是你的插件的名字,其模板如下:…
开发asp.net mvc程序,多少是离不开jQuery客户程序.今天Insus.NET学习jQuery的一个on事件驱动. 先在网页视图放一个图片铵钮,用户可以使用mouse对这图片时行over,out或是click,根据不同的事件来更变图片src. 控制器中创建一个Action: 创建视图: 建好视图之后,分别按钮上面标记1至3步骤来实现,标记1是拉一个input,type为image: 标记2引用jQuery类库:标记3是实现所有事件代码. 在script中,先定义好三个图片src路径:…