以下是一个简单的例子，演示如何使用 jQuery 链式调用：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>jQuery Chaining</title>
<!-- 引入 jQuery -->
<script src="https://code.jquery.com/jquery-3.6.4.min.js"></script>
<style>
div {
width: 100px;
height: 100px;
background-color: lightblue;
margin: 10px;
}
</style>
</head>
<body>
<script>
$(document).ready(function(){
// 链式调用
$("#myDiv")
.css("background-color", "orange")
.width(200)
.height(200)
.fadeOut(2000)
.fadeIn(2000);
});
</script>
</body>
</html>
在这个例子中，$("#myDiv") 选中了一个具有 myDiv id 的元素，然后通过链式调用，依次执行了 css()、width()、height()、fadeOut() 和 fadeIn() 方法。每个方法都返回一个 jQuery 对象，使得下一个方法可以直接在上一个方法的返回结果上继续调用。
通过链式调用，可以在一行代码中对同一元素进行多个操作，使代码更为紧凑和易读。
转载请注明出处：http://www.zyzy.cn/article/detail/4616/jQuery