Skip to main content
1 de 2
Diego Henrique
  • 2,9mil
  • 5
  • 22
  • 56

Qual modo é possível acrescentar de 5 em 5 números e exibir removendo os anteriores a cada clique no botão incrementar/decrementar?

A intenção é correr os cinco [5] primeiros números carnidais em sequência sendo exibidos de cinco-em-cinco, mas devendo se apagado os anteriores e posteriormente correr mais cinco [10] (que vai do 6 à 10), até atingir um certo limite imposto dentro da função, ou seja, será determinado até que ponto esses numerais serão aplicados pelos botões 'incrementar' e 'desicrementar'. Tenho tentado da seguinte forma:

<center>

    <button id="menos" onclick="esconderGrupo">-</button>

        <span>1</span>
        <span>2</span>
        <span>3</span>
        <span>4</span>
        <span>5</span>  

    <button id="mais" onclick="mostrarGrupo">+</button>

</center>

<script>
    var spn = document.getElementsByTagName('span');

function mostrarGrupo() {
    // Limitar o número de números a serem exibidos
    var inicio = 5;
    // Correr elementos span afim de quantificar
    for (var i=0; i < spn.length; i++) {
    spn[i].innerHTML += inicio+1;
    inicio ++
    }
    }

function esconderGrupo() {
    // Limitar o número de números a serem exibidos
    var inicio = 5;
    // Correr elementos span afim de quantificar
    for (var i=0; i < spn.length; i--) {
    spn[i].innerHTML += inicio+1;
    inicio --
    }
    }
</script>

PRINT

inserir a descrição da imagem aqui

inserir a descrição da imagem aqui

No momento estou pensando em outras soluções para este fim. No entanto, gostaria de ouvir ou ver o que vocês me sugerem?

Diego Henrique
  • 2,9mil
  • 5
  • 22
  • 56