<! DOCTYPE html>"en">"UTF-8"> <title> Write plug-in chestnuts </title>class="lazyimg"Src="Http://static.m1905.cn/images/vip/cnc/lazyImg.gif"Data-lazysrc="http://image11.m1905.cn/uploadfile/2015/0422/thumb_1_220_318_20150422091710455317.jpg"Width=" -"height="318"alt="The gods are here."> class="lazyimg"Src="Http://static.m1905.cn/images/vip/cnc/lazyImg.gif"Data-lazysrc="http://image11.m1905.cn/uploadfile/2015/0401/thumb_1_174_98_20150401051450832875.jpg"alt=""Width=" -"height="318"> class="lazyimg"Src="Http://static.m1905.cn/images/vip/cnc/lazyImg.gif"Data-lazysrc="http://image11.m1905.cn/uploadfile/2015/0422/thumb_1_220_318_20150422092027822146.jpg"alt=""Width=" -"height="318"></body>"Http://js.static.m1905.cn/core/jquery-edge.min.js"></script><script type="Text/javascript">(function ($) {$.FN.CHANGEIMGSRC=function (options) {varDefaults = { "Data":"data-lazysrc", 'Border':"1px solid Red" }; //extend is the combination of options and defaults set, in which the result of this config is actually defaults defined object, so when the value can be directly config to take to the data border such as custom properties//defaults = {//"A": 1,//"B": 2// }; //options = {//"A": 1,//"B": 3// }; //then config = {//"A": 1,//"B": 3// } //The final customization with the options is the highest priority, defaults default second varConfig =$.extend ({}, defaults, options); return This. each (function () {varLAZYSRC = $ ( This). attr (Config.data); $( This). attr ('src', LAZYSRC). CSS ("Border", Config.border); }) } $('img'). CHANGEIMGSRC ({'Data':"data-lazysrc", 'Border':'20px Solid Yellow' });}) (jQuery);</script>
Dry front-end for two years, the first time you try to package a small plug-in, although a little late but still very excited! Up
jquery plug-in packaging idea finishing