JQuery的链式操作

来源:互联网 发布:淘宝网官网注册 编辑:程序博客网 时间:2024/05/22 09:06

<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.0.js"></script><script type="text/javascript">$(document).ready(function(){$("#change").click(function(){$("#p1").css("color","red").slideUp(2000).slideDown(2000);});});</script></head><body><p id="p1">这是一个测试!</p><button id="change">点击开始</button></body></html>

我们可以注意到,  

$("#change").click(function(){
        $("#p1").css("color","red").slideUp(2000).slideDown(2000);
    });

本来应该写成

        $("#p1").css("color","red");
        $("#p1").slideUp(2000);
        $("#p1").slideDown(2000);


因为Jquery的这些方法,运行完后都会返回当前对象,所以可以进行链式操作。(和Java中的操作很类似)

0 0