Ejemplo de Escribir Con JavaScript

Inicio » JavaScript » Escribir con JavaScript

Uno de los usos comunes de JavaScript es escribir o modificar contenido en una página web. En este artículo, exploraremos las 3 diferentes maneras de escribir y actualizar contenido en una página utilizando JavaScript.

Método 1: Escribir contenido con document.write()

El método document.write() permite escribir contenido HTML directamente en una página web. Aunque es fácil de usar, ya no es recomendable, pues puede causar problemas si se usa después de que la página haya sido completamente cargada. Es la forma más sencilla y simple. Ejemplo:

<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ejemplo de escribir contenido con JavaScript</title>
</head>
<body>
<script type="text/javascript">
document.write("<h1>Hola, mundo!</h1>");
</script>
</body>
</html>

Método 2: Escribir contenido con innerHTML

El uso de la propiedad innerHTML es una manera más flexible y recomendada de escribir o modificar contenido en una página web. Puedes seleccionar un elemento HTML específico y cambiar su contenido.  Ejemplo:

<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ejemplo de escribir contenido con JavaScript</title>
</head>
<body>
<div id="miDiv"></div>
<script type="text/javascript">
document.getElementById("miDiv").innerHTML = "<h2>¡Hola, mundo!</h2>";
</script>
</body>
</html>

Método 3: Escribir contenido con textContent o innerText

Si solo deseas cambiar el contenido de texto de un elemento y no necesitas agregar etiquetas HTML, puedes usar las propiedades textContent o innerText.  Ejemplo:

<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ejemplo de escribir contenido con JavaScript</title>
</head>
<body>
<p id="miParrafo"></p>
<script type="text/javascript">
document.getElementById("miParrafo").textContent = "¡Hola, mundo!";
// O usa innerText:
// document.getElementById("miParrafo").innerText = "¡Hola, mundo!";
</script>
</body>
</html>

¿Cómo citar? & Del Moral, M. (s.f.). Ejemplo de Escribir Con JavaScript.Ejemplo de. Recuperado el 27 de Septiembre de 2023 de https://www.ejemplode.com/24-javascript/95-ejemplo_de_escribir_con_javascript.html

Escrito por:
Mauricio del Moral Durán
Mauricio del Moral, fundador y creador de Ejemplo de, es un experto en enseñanza y un apasionado del ámbito educativo desde el año 2007. Ha dedicado una considerable parte de su vida profesional al estudio y al desarrollo de contenidos educativos en formatos digitales de alta calidad. Poseedor de una Licenciatura en Ciencias de la Comunicación, Mauricio es egresado de la prestigiosa Universidad Intercontinental.
Última modificación: 2023-04-05

Últimos 10 comentarios

  1. hola ke tal esgennial
    Por miguel 2011-06-15 a las 18:54:57
  2. Es importante la comunicación por el internet que nos ayuda a superr las ignorancias
    Por jose felix 2010-08-06 a las 17:39:54

Deja un comentario


Acepto la política de privacidad.