1 (function ($) { 2 $.fn.extend({ 3 "highLight": function (options) { 4 //检测用户传进来的参数是否合法 5 if (!isValid(options)) 6 return this; 7 var opts = $.extend({}, defaluts, options); //使用jQuery.extend 覆盖插件默认参数 8 return this.each(function () { //这里的this 就是 jQuery对象。这里return 为了支持链式调用 9 //遍历所有的要高亮的dom,当调用 highLight()插件的是一个集合的时候。 10 var $this = $(this); //获取当前dom 的 jQuery对象,这里的this是当前循环的dom 11 //根据参数来设置 dom的样式 12 $this.css({ 13 backgroundColor: opts.background, 14 color: opts.foreground 15 }); 16 //格式化高亮文本 17 var markup = $this.html(); 18 markup = $.fn.highLight.format(markup); 19 $this.html(markup); 20 }); 21 22 } 23 }); 24 25 26 //默认参数 27 var defaluts = { 28 foreground: 'red', 29 background: 'yellow' 30 }; 31 //公共的格式化 方法. 默认是加粗,用户可以通过覆盖该方法达到不同的格式化效果。 32 $.fn.highLight.format = function (str) { 33 return "<strong>" + str + "</strong>"; 34 } 35 //私有方法,检测参数是否合法 36 function isValid(options) { 37 return !options || (options && typeof options === "object") ? true : false; 38 } 39 })(window.jQuery);