本教程操作环境：windows10系统、jquery3.6.0版本、Dell G3电脑。
【资料图】
jquery链式编程是什么
实现链式编程的核心，是对象中的每一个方法都会返回当前对象。
链式编程：多行代码合并成一行代码，前提要认清此行代码返回的是不是对象，是对象才能进行链式编程
链式编程:对象.方法().方法().方法();......
一、链式编程
二、常用绑定事件函数的链式编程
举例：
//这是普通的事件绑定$("button").click(function() {console.log("1")})$("button").mouseenter(function() {console.log("2")})$("button").mouseleave(function() {console.log("3")})//与上文功能相同的链式编程$("button").click(function() {console.log("1")}).mouseenter(function() {console.log("2")}).mouseleave(function() {console.log("3")})三、on函数的链式编程
举例：
//普通写法$("#btn1").on("click",function(){console.log("点击事件")})$("#btn1").on("mouseenter",function(){ //注意这里的on函数的链式编程console.log("鼠标聚焦事件")})$("#btn1").on("mouseleave",function(){ //注意这里的on函数的链式编程console.log("鼠标失焦事件")})//链式编程$("#btn1").on("click",function(){console.log("点击事件")}).on("mouseenter",function(){ //注意这里的on函数的链式编程console.log("鼠标聚焦事件")}).on("mouseleave",function(){ //注意这里的on函数的链式编程console.log("鼠标失焦事件")})四、bind函数的链式编程
举例：
//普通写法$("button").bind({"click":function(){console.log("点击事件")}})$("button").bind({"mouseenter":function(){console.log("鼠标聚焦事件")}})$("button").bind({"mouseleave":function(){console.log("鼠标离焦事件")}})//链式编程$("button").bind({"click":function(){console.log("点击事件")},"mouseenter":function(){console.log("鼠标聚焦事件")},"mouseleave":function(){console.log("鼠标离焦事件")}})五、混合使用
举例：
//混合使用$("button").bind({"click":function(){console.log("点击事件")}})$("button").bind({"mouseenter":function(){console.log("鼠标聚焦事件")}}).mouseleave(function(){console.log("混合使用的离焦事件")})运行结果：
视频教程推荐：jQuery视频教程
以上就是jquery链式编程是什么的详细内容，更多请关注php中文网其它相关文章！
