jquery链式操做初体验

首先，咱们要了解什么是jquery链式操做。

          链式操做就是经过对象上的方法，最后return this把对象再返回回来，对象的继续调用。咱们作一个小的JS效果（模仿taobao的评分）：

<ul id="list">
    <li>★</li>
    <li>★</li>
    <li>★</li>
    <li>★</li>
    <li>★</li>
</ul>

ul li{
      list-style: none;
      float: left;
      }

/*链式操做*/
$("ul li").hover(
            function(){$(this).css("color","#f9c").prevAll().css("color","#f9c");}
            ,function(){$(this).css("color","").prevAll().css("color","");}
    ).click(function(){$("#list").children("li").off();});

最直观的好处就是代码量减小了，看着也美观大方。

若是没有链式操做，完成这个效果须要写onmouseover（），onmouseout（），onclick（）三个事件来实现。代码会多不少，这就是链式操做减小代码的最直观感觉，可是全部对象的方法返回的都是对象自己，也就是说没有返回值，这不必定在任何环境下都适合。

那为何要用链式操做呢？

为了更好的异步体验，Javascript是无阻塞语言，不是Javascript没阻塞，而是由于Javascript是经过事件来驱动，异步来完成一些本须要阻塞进程的操做。