Reuse a function

Asked

Viewed 111 times

1

Can someone help me in how I reuse the functions to simplify the code and make it cleaner ?

function bonusPL(){
    
    var bonusPL = document.getElementById("bonusPL");// seleciona o elemento pai
    var checkBoxe = document.createElement("input");//cria o elemento e seleciona o atribudo checkbox
    checkBoxe.setAttribute("type", "checkbox");
    checkBoxe.setAttribute("id","inputbonusPL");
    var nome = document.createElement("label");// Adiciona o elemento para adicionar o texto no checkbox
    nome.textContent = "Dobro de PLs"// Insere o texto no elemento criado
    bonusPL.appendChild(checkBoxe);// Coloca o CheckBox no elemento Pai   
    bonusPL.appendChild(nome) // Atribui o texto 

}
function bonusMonths(){
    
    var bonusMonths = document.getElementById("bonusMonths");// seleciona o elemento pai
    var checkBoxe = document.createElement("input");//cria o elemento e seleciona o atribudo checkbox
    checkBoxe.setAttribute("type", "checkbox");
    checkBoxe.setAttribute("id","inputbonusMonths");
    var nome = document.createElement("label");// Adiciona o elemento para adicionar o texto no checkbox
    nome.textContent = "Extensão de 2 meses";// Insere o texto no elemento criado
    bonusMonths.appendChild(checkBoxe);// Coloca o CheckBox no elemento Pai
    bonusMonths.appendChild(nome)// Atribui o texto 


}
function bonusRescue(){
    // seleciona o elemento pai
    var bonusRescue = document.getElementById("bonusRescue");
    //cria o elemento e seleciona o atribudo checkbox
    var checkBoxe = document.createElement("input");
    checkBoxe.setAttribute("type", "checkbox");
    checkBoxe.setAttribute("id","inputbonusRescue");
    // Adiciona o elemento para adicionar o texto no checkbox
    var nome = document.createElement("label");
    // Insere o texto no elemento criado
    nome.textContent = "Resgate de PLs"
    // Coloca o CheckBox no elemento Pai
    bonusRescue.appendChild(checkBoxe);
    // Atribui o texto 
    bonusRescue.appendChild(nome)
}
function bonus50(){
    var bonus50 = document.getElementById("bonus50");
    var checkBoxe = document.createElement("input");
    checkBoxe.setAttribute("type", "checkbox");
    checkBoxe.setAttribute("id", "inputbonus50");
    var nome = document.createElement("label");
    nome.textContent = "Desconto de 40 a 50%"
    bonus50.appendChild(checkBoxe);
    bonus50.appendChild(nome)
}

function offersBase(){

    bonusPL();
    bonusMonths();
    bonusRescue();
    bonus50()
    
}

// ***** Ofertas sazonais *****

function offer10(){
    // seleciona o elemento pai
    var offer10 = document.getElementById("offer10");
    //cria o elemento e seleciona o atribudo checkbox
    var checkBoxe = document.createElement("input");
    checkBoxe.setAttribute("type", "checkbox");
    checkBoxe.setAttribute("id","inputOffer10");
    // Adiciona o elemento para adicionar o texto no checkbox
    var nome = document.createElement("label");
    // Insere o texto no elemento criado
    nome.textContent = "Multa de 10%"
    // Coloca o CheckBox no elemento Pai
    offer10.appendChild(checkBoxe);
    // Atribui o texto 
    offer10.appendChild(nome)
}
function offer10da(){
    // seleciona o elemento pai
    var offer10da = document.getElementById("offer10da");
    //cria o elemento e seleciona o atribudo checkbox
    var checkBoxe = document.createElement("input");
    checkBoxe.setAttribute("type", "checkbox");
    checkBoxe.setAttribute("id", "inputOffer10da")
    // Adiciona o elemento para adicionar o texto no checkbox
    var nome = document.createElement("label");
    // Insere o texto no elemento criado
    nome.textContent = "Multa de 10%"
    // Coloca o CheckBox no elemento Pai
    offer10da.appendChild(checkBoxe);
    // Atribui o texto 
    offer10da.appendChild(nome)
}
function bonus1real(){
    // seleciona o elemento pai
    var bonus1real = document.getElementById("bonus1real");
    //cria o elemento e seleciona o atribudo checkbox
    var checkBoxe = document.createElement("input");
    checkBoxe.setAttribute("type", "checkbox");
    checkBoxe.setAttribute("id","inputBonus1real")
    // Adiciona o elemento para adicionar o texto no checkbox
    var nome = document.createElement("label");
    // Insere o texto no elemento criado
    nome.textContent = "Primeira de R$1"
    // Coloca o CheckBox no elemento Pai
    bonus1real.appendChild(checkBoxe);
    // Atribui o texto 
    bonus1real.appendChild(nome)
}
function offer12x(){
    // seleciona o elemento pai
    var offer12x = document.getElementById("offer12x");
    //cria o elemento e seleciona o atribudo checkbox
    var checkBoxe = document.createElement("input");
    checkBoxe.setAttribute("type", "checkbox");
    checkBoxe.setAttribute("id","inputOffer12x")
    // Adiciona o elemento para adicionar o texto no checkbox
    var nome = document.createElement("label");
    // Insere o texto no elemento criado
    nome.textContent = "Boleto em mais de 10x";
    // Coloca o CheckBox no elemento Pai
    offer12x.appendChild(checkBoxe);
    // Atribui o texto 
    offer12x.appendChild(nome)
}
function offerPoints(){
    // seleciona o elemento pai
    var offerPoints = document.getElementById("offerPoints");
    //cria o elemento e seleciona o atribudo checkbox
    var checkBoxe = document.createElement("input");
    checkBoxe.setAttribute("type", "checkbox");
    checkBoxe.setAttribute("id","inputofferPoints")
    // Adiciona o elemento para adicionar o texto no checkbox
    var nome = document.createElement("label");
    // Insere o texto no elemento criado
    nome.textContent = "Pontos do Portal";
    // Coloca o CheckBox no elemento Pai
    offerPoints.appendChild(checkBoxe);
    // Atribui o texto 
    offerPoints.appendChild(nome)
}

javascript function

  • It was not clear your question, for what purpose you will reuse? add more details of your doubt, show the full code.

  • This code repeats itself several times, some things change, but in general they are the same thing, to put all

1 answer

0


Since all the elements that are created in the functions are of the same type, the only things that vary are the texts and the id's, can only use a generic function:

function offer(off, txt){
    // seleciona o elemento pai
    var pai = document.getElementById(i);
    //cria o elemento e seleciona o atribudo checkbox
    var checkBoxe = document.createElement("input");
    checkBoxe.setAttribute("type", "checkbox");
    checkBoxe.setAttribute("id","input"+off[0].toUpperCase()+off.substr(1));
    // Adiciona o elemento para adicionar o texto no checkbox
    var nome = document.createElement("label");
    // Insere o texto no elemento criado
    nome.textContent = txt;
    // Coloca o CheckBox no elemento Pai
    pai.appendChild(checkBoxe);
    // Atribui o texto 
    pai.appendChild(nome)
}

Where the parameter off is the id of the element father and the txt the text to be inserted.

For example, you should call the function this way:

offer('bonus1real', 'Primeira de R$1');

or

offer('bonusPL', 'Dobro de PLs');

Browser other questions tagged javascript function

You are not signed in. Login or sign up in order to post.