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

我是jQuery新手，所以如果这是一个愚蠢的问题，我道歉：）

我面临的挑战是如何使我的团队使用的代码足够简单，以允许“技能”较低的人进行更新

我已经为所有需要更改的内容设置了变量，并且按照我的预期工作

我唯一的疑问是，我会一遍又一遍地运行相同的4件事情，我觉得我可以在函数中实现我想要的东西

这里有一把小提琴，上面有3个不同的横幅：

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

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

var$primarybaner1=$（“#banner-01”）；
$primaryBanner1.attr（'title'，PrimaryOneText）；
$primaryBanner1.html（“+PrimaryOneText+”）；
$primaryBanner1.attr（'href'，primaryOneUrl）；
$primarybaner1.css（“背景”、“url”（+primaryOneImg+））；

有没有办法把它简化成一个更小的函数？而不是每页有15次相同的4行

任何帮助都会非常好

---

谢谢

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

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);

函数样式横幅（选择器、txt、url、img）{
变量$el=$（选择器）；
$el.attr({
标题：txt，
href:url
}).css（'background'，'url（'+img+'））
.html（“”+txt+“”）；
返回$el；
}
var$primarybaner1=styleBanner（'#banner-01'，primaryonext，primaryOneUrl，primaryOneImg）；

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

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);

函数样式横幅（选择器、txt、url、img）{
变量$el=$（选择器）；
$el.attr({
标题：txt，
href:url
}).css（'background'，'url（'+img+'））
.html（“”+txt+“”）；
返回$el；
}
var$primarybaner1=styleBanner（'#banner-01'，primaryonext，primaryOneUrl，primaryOneImg）；

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

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);

函数样式横幅（选择器、txt、url、img）{
变量$el=$（选择器）；
$el.attr({
标题：txt，
href:url
}).css（'background'，'url（'+img+'））
.html（“”+txt+“”）；
返回$el；
}
var$primarybaner1=styleBanner（'#banner-01'，primaryonext，primaryOneUrl，primaryOneImg）；

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

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);

函数样式横幅（选择器、txt、url、img）{
变量$el=$（选择器）；
$el.attr({
标题：txt，
href:url
}).css（'background'，'url（'+img+'））
.html（“”+txt+“”）；
返回$el；
}
var$primarybaner1=styleBanner（'#banner-01'，primaryonext，primaryOneUrl，primaryOneImg）；

每个jquery对象都会返回它自己，这样你就可以很容易地找到它们：$primarybaner1.attr（…）.html（…），所以我只想说，如果这是你想要改进的工作代码，可能更适合这个问题。谢谢David！老实说，我甚至不知道这个存在！每个jquery对象都会返回它自己，这样您就可以很容易地找到它们：$primarybaner1.attr（…）.html（…），所以我只想提到，如果这是您想要改进的工作代码，可能更适合这个问题。谢谢David！老实说，我甚至不知道这个存在！每个jquery对象都会返回它自己，这样您就可以很容易地找到它们：$primarybaner1.attr（…）.html（…），所以我只想提到，如果这是您想要改进的工作代码，可能更适合这个问题。谢谢David！老实说，我甚至不知道这个存在！每个jquery对象都会返回它自己，这样您就可以很容易地找到它们：$primarybaner1.attr（…）.html（…），所以我只想提到，如果这是您想要改进的工作代码，可能更适合这个问题。谢谢David！老实说，我甚至不知道这个存在！我还建议将所有参数（txt、url、img）添加到选项对象{txt:'text'，url:'url'}中，这样以后就更容易扩展了。太棒了！谢谢你的帮助，罗布！我不太确定@n0mercy是什么意思？我已经更新了第一个示例的脚本，以澄清我的建议。我还建议将所有参数（txt、url、img）添加到选项对象{txt:'text'，url:'url'}中，以便将来更容易扩展。太棒了！谢谢你的帮助，罗布！我不太确定@n0mercy是什么意思？我已经更新了第一个示例的脚本，以澄清我的建议。我还建议将所有参数（txt、url、img）添加到选项对象{txt:'text'，url:'url'}中，以便将来更容易扩展。太棒了！谢谢你的帮助，罗布！我不太确定@n0mercy是什么意思？我已经更新了第一个示例的脚本，以澄清我的建议。我还建议将所有参数（txt、url、img）添加到选项对象{txt:'text'，url:'url'}中，以便将来更容易扩展。太棒了！谢谢你的帮助，罗布！我不太清楚@n0mercy是什么意思？我已经更新了第一个示例的脚本，以澄清我的建议