ex7_lista11.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Bairro</title>
</head>

<body>

    <input type="text" id="in_filme">
    <button onclick="CadastrarFilme()">Cadastrar Filme</button>
    <br>
    <h3>Filmes:</h3>
    <div id="div_mostrar"></div>
    

</body>

</html>
<script>

    listaFilmes = []

    function CadastrarFilme() {
        listaFilmes.push(in_filme.value)
        div_mostrar.innerHTML = ``
        
        for(var contador = 0; contador < listaFilmes.length; contador ++ ){
                     

            if (contador % 2 == 0) {
                // VERMELHO É PAR.
                div_mostrar.innerHTML += `<span style="color: blue;"> ${listaFilmes[contador]}</span><br>`

            }else{
                //ÍMPAR É AZUL
                div_mostrar.innerHTML += `<span style="color: red;"> ${listaFilmes[contador]}</span><br>`   
            }

            
        }

    }


</script>