select3.html

  1. <!DOCTYPE html>
  2. <html lang="es">
  3. <meta charset="UTF-8">
  4. <title>Select 3</title>
  5. function iniciar() {
  6. const select = document.querySelector('#tamaño');
  7. const parrafo = document.querySelector('#chiquito');
  8.  
  9. // Añadir todos los <option> al <select>
  10. const puntos = [ 6,8,10,12,14,16,18,24,36 ];
  11. for (const p of puntos) {
  12. const option = document.createElement('option');
  13. option.textContent = p+' puntos';
  14. option.setAttribute('value', p+'pt');
  15. select.appendChild(option);
  16. }
  17.  
  18. // Valor predeterminado
  19. const valor = localStorage.getItem('font-size') || '12pt';
  20. select.value = valor;
  21. parrafo.style.fontSize = valor;
  22. }
  23. function cambiarTamaño(select) {
  24. const parrafo = document.querySelector('#chiquito');
  25. parrafo.style.fontSize = select.value;
  26. localStorage.setItem('font-size', select.value);
  27. }
  28. </script>
  29. </head>
  30. <body onload="iniciar()">
  31. <h1>Select 3</h1>
  32. <p>
  33. <label>Tamaño de letra:</label>
  34. <select id="tamaño" onchange="cambiarTamaño(this)"></select>
  35. </p>
  36. <p id="chiquito">
  37. Lorem fistrum no te digo trigo por no llamarte Rodrigor
  38. a gramenawer caballo blanco caballo negroorl la caidita
  39. va usté muy cargadoo hasta luego Lucas pupita está la cosa
  40. muy malar a peich diodenoo. Diodeno te voy a borrar el cerito
  41. no te digo trigo por no llamarte Rodrigor me cago en tus muelas.
  42. Condemor a wan la caidita por la gloria de mi madre quietooor
  43. te va a hasé pupitaa. Ese pedazo de de la pradera pupita va
  44. usté muy cargadoo la caidita torpedo no puedor a gramenawer.
  45. Torpedo te voy a borrar el cerito pupita la caidita ese pedazo
  46. de por la gloria de mi madre ese que llega va usté muy cargadoo
  47. está la cosa muy malar te va a hasé pupitaa hasta luego Lucas.
  48. </p>
  49. </body>
  50. </html>

Proinf.net