[宅] javascript筆記(6) - jQuery plugin

在使用jqgrid時一定常看到這種用法：
$("#grid").jqgrid(.....);

這種對jQuery元素做操作的method就是利用extend把它綁在上面的，而extend又分兩種用法：
jQuery.extend
jQuery.fn.extend

第一種jQuery.extend可以看作是直接在jQuery上加入一個方法，舉個網路上找到的例子：

 <script type="text/javascript">
        jQuery.extend({
            add: function(a, b) {
                return a + b;
            }
        });
        alert($.add(3, 4)); //7
 </script>
這樣的功能可以直接用"$.定義的function"來執行。

第二種jQuery.fn.extend只能用在jQuery元素上，jqgrid用的就是這種方法了，當要對元素做操作時只要用this即可：

 <script type="text/javascript">
        jQuery.fn.extend({
            red: function() {
                return $(this).css('color', '#ff0000');
            }
        });
        $('#test').red();
</script>

在網路上查了一下也有發現不用extend來做plugin的：

$.fn.hilight = function() {
  // Our plugin implementation code goes here.
};
但這之間有什麼差異就還要再做研究了~

更詳細一點的介紹與範例可以看：ericsk.net-擴充 jQuery