Ejercicio con los métodos de array

Crear la página "lista.html" con lo siguiente:

<p>
    <label>Lista</label>
    <br>
    <textarea id="lista"></textarea>
</p>
<p>
    <label>Elemento</label>
    <br>
    <input type="text" id="elemento">
</p>
<p>
    <button id="agregar">Agregar</button>
    <button id="quitar">Quitar</button>
</p>

Al pulsar el botón de agregar:

  1. Recoger el elemento del INPUT
  2. Añadir con push a un array global
  3. Mostrar el array en el TEXTAREA con join

Al pulsar el botón de quitar:

  1. Quitar con pop un elemento del array
  2. Mostrar el elemento quitado en el INPUT
  3. Mostrar el array en el TEXTAREA con join

Código JS

Todo el código Javascript estará en el archivo "lista.js"

<script src="lista.js"></script>

Funciones que tendrá el fichero:

Eventos

Al cargar la página web:

document.addEventListener('DOMContentLoaded', principal);   

// <body onload="principal()">...

Al hacer clic en los botones:

var boton1 = document.querySelector('#agregar';
boton1.addEventListener('click', botonAgregar);

// <button onclick="botonAgregar()">...

Proinf.net