首頁技術(shù)文章正文

怎么給jQuery擴(kuò)展插件?【前端面試常問】

更新時(shí)間:2021-06-10 來源:黑馬程序員 瀏覽量:

1577370495235_學(xué)IT就到黑馬程序員.gif


(1)考察目標(biāo)
1)考察是否自己編寫過拓展插件
2)是否知道為jQuery擴(kuò)展插件的方法
(2)題目分析
1)通過$.extend()來擴(kuò)展jQuery
2)通過$.fn 向jQuery添加新的方法

代碼

 // 1. 通過$.extend()來擴(kuò)展jQuery
        // 語法: $.extend({})
        // 缺點(diǎn):這種方式無法利用jQuery強(qiáng)大的選擇器帶來的便利,

        $.extend({            log: function(msg) {                var now = new Date(),
                    y = now.getFullYear(),
                    m = now.getMonth() + 1,
                    d = now.getDate(),
                    h = now.getHours(),
                    min = now.getMinutes(),
                    s = now.getSeconds(),
                    time = y + '/' + m + '/' + d + ' ' + h + ':' + min + ':' + s;                console.log(time + '--' + msg);
            }
        })
        $.log('initializing'); //調(diào)用

        // 2. 通過$.fn 向jQuery添加新的方法
        /*
        語法
        $.fn.pluginName = function() {
        //your code goes here
        }
        */
        // 常用的方式
        $.fn.changeColor = function() {            //在這里面,this指的是用jQuery選中的元素
            this.css('color', 'red');
        }

        $(function() {
            $('a').changeColor();
        })
    </script>
(3)應(yīng)用場景
通過$.fn 向jQuery添加新的方法 是開發(fā)中常用的寫法,因?yàn)檫@種寫法可以利用jQuery強(qiáng)大的選擇器。





猜你喜歡:

寫出jQuery鏈?zhǔn)秸{(diào)用實(shí)現(xiàn)方法【前端面試題】

如何獲取jQuery?jQuery的使用演示

jQuery修改元素樣式的代碼演示

Jquery常用的選擇器有哪些?

黑馬程序員前端與移動(dòng)開發(fā)課程

分享到:
在線咨詢 我要報(bào)名
和我們在線交談!