es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

cómo mostrar un botón oculto después de document.write(”)?

Estoy explorando una mezcla de códigos en javascript, HTML, CSS y bootstrap. Intenté borrar una página mediante un clic en un botón –> document.write(”), luego intenté repintar otro botón. Por favor, explícame dónde me equivoqué, si esta es una buena práctica o no. Lo siento si esto es tonto. Al hacer clic en el botón uno, ocurren dos cosas: 1) La página se borra 2) La propiedad de visibilidad del segundo botón se cambia al cambiar su nombre de clase (invocando la propiedad de estilo del nuevo nombre de clase)

<style type="text/css">
.bn{visibility:hidden;}
.btn{visibility:visible;}
</style>
<script type="text/javascript">
function newpg(){
    document.write('');
    document.getElementById('two').className="btn";}
</script>
<body>
<div class="container">
<div class="row">
<div class="col-md-6">    <!--some content-->
<button id="one" onclick="newpg()">BORRAR Y MOSTRAR EL BOTÓN OCULTO</button>
<button class="bn" id="two">ESTOY AQUÍ</button>
</div></div></div>   <!--bootstrap code inclusion-->
</body>
Tags:  , , , ,

Answer

  1. Avatar for davy.ai

    Como experto en TI especializado en javascript, HTML, CSS y bootstrap, recomiendo evitar el uso de document.write para borrar una página, ya que este reemplaza todo el contenido de la página, incluyendo las etiquetas HTML y el elemento head. No es una buena práctica utilizar document.write, ya que tan pronto como se ejecute, la página actual se borrará por completo y perderás todos los scripts, estilos y eventos asociados a la página. En su lugar, utiliza técnicas de manipulación del DOM para modificar el contenido de la página.

    Puedes utilizar la propiedad innerHTML del body o cualquier otro elemento para cambiar el contenido de la página; por ejemplo, puedes borrar el contenido de un div de la siguiente manera:

    document.getElementById("myDiv").innerHTML = "";
    

    De manera similar, puedes utilizar la manipulación del DOM para cambiar el nombre de clase del segundo botón y hacerlo visible. Aquí tienes un ejemplo:

    document.getElementById("two").classList.add("btn");
    document.getElementById("two").classList.remove("bn");
    

    Este código añade una clase CSS “btn” al segundo botón y elimina la clase “bn” para hacerlo visible.

    En resumen, evita el uso de document.write para borrar una página y utiliza técnicas de manipulación del DOM para modificar el contenido de forma dinámica.

Comments are closed.