jQuery链式调用是什么意思?怎样实现�
Admin 2021-09-11 群英技术资�
这篇文章主要给大家分享jQuery链式调用的内容,下文有对jQuery链式调用的介绍以及实例,对新手学习和理解jQuery链式调用有一定的帮助,感兴趣的朋友就跟随小编来一起学习吧�
jQuery对象调用任何方法(除了节点关系方法)执行完后,方法都会有一个返回�,返回值就是jQuery对象自己,这个现象给我们提供了便利,可以对执行结果继续打点调用jQuery的方法和属性。即可以使用jQuery对象进行连续打点调用
console.log($(this).css("background-color", "pink").html("hello"));
jQuery对象调用除了节点关系的方法之外,其他的方法执行后,返回值就是对象自己,可以继续链式调用其他的jQuery对象的方法和属性。这样可以达到简化代码书�
� 点击一个元素,使它自己变粉色,兄弟变黄色,其父级变蓝色,父级的兄弟变色,父级的兄弟的自己变橘色
<style> * { margin: 0; padding: 0; } .box { width: 400px; height: 60px; border: 1px solid #000; margin-top: 2px; } .box p,.box h2 { float: left; width: 60px; height: 60px; margin-right: 20px; background-color: rgb(164, 247, 233); } </style> <!-------------------------------------------------------------------> <body> <div class="box"> <p></p> <p></p> <p></p> <p></p> <h2>h2</h2> </div> <div class="box"> <p></p> <p></p> <p></p> <p></p> <h2>h2</h2> </div> <div class="box"> <p></p> <p></p> <p></p> <p></p> <h2>h2</h2> </div> <div class="box"> <p></p> <p></p> <p></p> <p></p> <h2>h2</h2> </div> <script src="../jq/jquery-1.12.4.min.js"></script> <script> var $p = $("p"); var $box = $(".box") $p.click(function () { // 链式调用实现 $(this).css("background-color","pink") //自己变粉� .siblings().css("background-color","yellow") //自己的兄弟变黄色 .parent().css("background-color","skyblue") //并且自己的父级变蓝色
.siblings().css("background-color","lightgreen") //父级的兄弟跟着变成浅绿� .children().css("background-color","orange") //父级的兄弟的自己变橘� })
以上就是关于jQuery链式调用的相关的介绍了,上述示例具有一定的借鉴价值,有需要的朋友可以参考学习,想要了解更多jQuery链式调用的内容,大家可以继续浏览群英网络其他相关的文章�
文本转载自脚本之�
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:[email protected]进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容�
猜你喜欢
Structs是RUST中比较常见的自定义类型之一,又可以分为StructStruct,TupleStruct,UnitStruct三个类型,结合泛型、Trait限定、属性、可见性可以衍生出很丰富的类型。结构体1.定义pub struct User{ user_id : u32, user_name: St
在网页设计中,导航栏的设计也是很重要的一部分,但是网上很多导航栏都是千篇一律的,对此这篇文章就给大家分享一个动画导航栏效果的实现,实现代码及效果如下,感兴趣的朋友可以参考�
这篇文章主要给大家分享js不常见操作运算符总结,下面文章收i部分js操作运算符得介绍,需要的朋友可以参考一下,希望对你有帮�
判断方法�1、用“输入控件对�.value”语句获取用户输入的数据�2、用“var re = /^[0-9]+.?[0-9]*/;”语句定义正则表达式对象�3、用“re.test(输入数据)”语句通过正则表达式判断输入数据是否为数值类型�
node进程间如何通信?下面本篇文章带大家了解node进程的通信方式,以及在node中如何实现这些方式的通信,希望对大家有所帮助�
成为群英会员,开启智能安全云计算之旅
立即注册Copyright © QY Network Company Ltd. All Rights Reserved. 2003-2020 群英 版权所�
增值电信经营许可证 : B1.B2-20140078