js 插件學(xué)習(xí)demo

發(fā)布時(shí)間：2020-07-05 02:28:06 來(lái)源：網(wǎng)絡(luò) 閱讀：303 作者：v512345 欄目：開(kāi)發(fā)技術(shù)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="js/jquery-1.11.3.min.js"></script>
<script type="text/javascript">
(function ($) {
   //默認(rèn)參數(shù) (放在插件外面，避免每次調(diào)用插件都調(diào)用一次，節(jié)省內(nèi)存)
   var defaults = {
       color: '紅色'
   };
   //擴(kuò)展
   $.fn.extend({
       //插件名稱(chēng)
       height: function (options) {
           //覆蓋默認(rèn)參數(shù)
           var opts = $.extend(defaults, options);
           //主函數(shù)
           return this.each(function () {
               //激活事件
               var obj = $(this);
               obj.click(function () {
                   alert(opts.color);
               });
           });
       }
   })
})(jQuery);

$(function () {
   $("#p333").height({ color: 'black2' });
});
</script>
</head>

<body>

<p id="p333">
click here
</p>
</body>
</html>

向AI問(wèn)一下細(xì)節(jié)

js 插件學(xué)習(xí)demo

猜你喜歡

最新資訊

相關(guān)推薦

相關(guān)標(biāo)簽