Question

我是jQuery的新手 - 如果这是一个愚蠢的问题我很抱歉：）

我的挑战是让我的团队使用的代码足够简单，以便让那些“熟练”的人更新它。

我为所有需要改变的东西设置了变量，它按照我的预期运作。

我唯一的疑问是，我会一遍又一遍地运行同样的4件事，我觉得我能在功能中实现我想要的东西吗？

以下是3个不同横幅的动作： http://jsfiddle.net/8ez46mpg/

我针对不同的横幅重复了几次：

var $primaryBanner1 = $('#banner-01');
$primaryBanner1.attr('title', primaryOneTxt);
$primaryBanner1.html("<h2>" + primaryOneTxt + "</h2>");
$primaryBanner1.attr('href', primaryOneUrl);
$primaryBanner1.css("background", "url("+primaryOneImg+")");

有什么方法可以将它简化为更小的功能吗？而不是每页最多15行相同的4行？

任何帮助都会非常棒！

谢谢！

Answer 1

只需创建一个执行重复操作并传入动态变量的函数。

function styleBanner(selector, txt, url, img){
  var $el = $(selector);
  $el.attr({
    title: txt,
    href: url
  }).css('background', 'url('+img+')')
    .html('<h2>'+txt+'</h2>');

  return $el;
}

var $primaryBanner1 = styleBanner('#banner-01', primaryOneTxt, primaryOneUrl, primaryOneImg);

jQuery - 向函数添加代码以简化（停止重复类似的事情）

1 个答案: