Chiedi login per aggiungere la catena? - javascript, jquery

Ho un classico codice JQuery / JavaScript dove accludo un gruppo di elementi usando il metodo concatenato.

jQuery("<div>").addClass("HEADER").append(
jQuery("<span>").addClass("TARGET ").html("&nbsp;").css("width", "25px")
).append(
jQuery("<span>").addClass("NAME HEADER").text(localization.opportunity).css("width", defaultNameSize-paddingTotal)
).append(
jQuery("<span>").addClass("HEIGHT HEADER").text(localization.amount)
).append(
jQuery("<span>").addClass("ANSWER HEADER").css("display", "none").text(localization.solution)
).append(
jQuery("<span>").addClass("VALUETYPE HEADER").text(localization.type)
).append(
jQuery("<span>").addClass("VALUETOLEFT HEADER").css("display", "none").text(abbreviate(CAT_VALUETOUS))
).append(
jQuery("<span>").addClass("VALUETORIGHT HEADER").css("display", "none").text(abbreviate(CAT_VALUETOTHEM))
)

Voglio solo aggiungere un elemento nel mezzosolo se tale e tale condizione è vera. Potrei dividerlo in tre diverse catene di metodi e aggiungere la logica al centro per vedere se un tale elemento dovrebbe essere aggiunto.

Ma, mi stavo chiedendo c'era una soluzione più elegante?

Grazie

risposte:

Potresti semplicemente usare un operatore condizionale per passare facoltativamente null a .append() se la tua condizione non è soddisfatta. jQuery ha vinto "t mente.

// snip
.append(...)
.append(someBoolean ? jQuery(...) : null)
.append(...)
// snip

Nota c'è una sintassi più compatta per la creazione di elementi di quello che stai usando:

jQuery("<span>", { "class": "foo", text: "bar", css: "baz" });

Crea una serie di oggetti che rappresentano gli elementi che desideri aggiungere. Per esempio

var elements = [{ element: "<span>",
class: "TARGET",
html: "stuff",
text: "node text"
}];

$(elements).each(function(i, element) {
// your logic here
$("<div>")
.append(element.element)
.addClass(element.class)
.html(element.html)
.text(element.text);
});