Tengo un formulario que lleva información de un HTML a otro usando el almacenamiento local. Dado que este texto cambia según lo que ingresa el usuario en el primer HTML, tengo que encontrar una manera de agregar un elemento de texto que permanezca con la salida. Por ejemplo: si un usuario escribe "Luke" y lo envía, lo ideal sería que la página siguiente dijera "Luke's" (los "s" son el elemento de texto separado). Dado que el texto puede ser más largo, por ejemplo, Lukas o Lucius, el elemento de texto "'s" debe permanecer al final del anterior, independientemente de su longitud.
<h1 id="show"> <!-- this is where the output text shows --> </h1> <h1 class="epic1">'s epic <!-- this is what i want to stick to the end of the output element --> </h1>También debo agregar que este JS no está funcionando ...
<script> document.getElementById("show").textContent += "'s"; </script>Puede usar un pseudo elemento :after para esto. Su contenido definido se agregará a cualquier elemento que tenga la clase a la que se refiere, y se le aplicará automáticamente el estilo del mismo modo que el elemento al que se adjunta:
.epic1:after { content: "'s epic"; } <h1 class="epic1">Tom</h1>No estoy seguro de si es la mejor manera, pero agregué un div con una nueva clase alrededor del elemento show y usé ::after en css para agregar contenido.
.hey ::after { font-weight: bold; color: black; content: "'s"; } <div class="hey"> <h1 id="show"> </h1> </div>