Ejercicio eventos

Vamos a crear una web con un input para introducir una cadena y un botón normalizar.
Cuando le demos al botón en un texto aparte vamos a mostrar la cadena normalizada utilizando la función que hemos visto a primera hora de la mañana de normalizar.

Pasos a dar:

Crear el HTML (Mínimo un input, un button y un h1 para mostrar)
En JS:
Añadir la función normalizar (copiada de trifulcas)

Añadir al botón evento click -> llamamos a la función normalizar? NO. Llamamos a una función que se
encargue de recuperar la cadena,llamar a la función normalizar y mostrar el valor
function procesar()–>
1.- Recuperar el valor que nos han introducido en el input
2.- Llamar a la función normalizar con ese valor
3.- El resultado ponerlo en el HTML

<div class="container ">

		<div class="form-group">
			<label for="cadena">Cadena:</label>
			<input type="text" class="form-control" id="cadena" placeholder="Introduce una cadena">
		</div>
		<button id="normalizar">Normalizar</button>
		<h1 id="texto"></h1>

		<script src="js/test.js"></script>
	</div>

// Añado el evento click al botón, llamando a procesar
document.getElementById('normalizar').addEventListener('click', procesar)

// Esta función se encarga de hacer de intermediario entre el HTML
// Y los cálculos que yo necesito
function procesar () {
  // Recupero el valor
  const cadena = document.getElementById('cadena').value
  // Hago el cálculo
  const resultado = normalizar(cadena)
  // Muestro el valor
  document.getElementById('texto').innerHTML = resultado
}

// Recupero la función normalizar de un ejercicio anterior
function normalizar (direccion) {
  const cod = ['cp', 'c.p.']
  for (const v of cod) {
    const pos = direccion.indexOf(v)
    if (pos > -1) {
      direccion = direccion.slice(0, pos)
    }
  }
  return direccion.trim()
}