Propiedad HTML DOM interiorHTML

La propiedad DOM innerHTML se usa para establecer o devolver el contenido HTML de un elemento.

Sintaxis:

Devuelve la propiedad innerHTML.

Object.innerHTML

Se utiliza para establecer la propiedad innerHTML.

Object.innerHTML = value

Dónde,

  • valor: Representa el contenido de texto del elemento HTML.

Valor devuelto: esta propiedad devuelve una string que representa el contenido HTML de un elemento.

Ejemplo 1: este ejemplo muestra cómo cambiar el contenido de la etiqueta de párrafo mediante la propiedad innerHTML. 

HTML

<!DOCTYPE html>
<html>
 
<body style="text-align: center">
    <h1 style="color:green">
        GeeksforGeeks
    </h1>
    <h2>
        DOM innerHTML Property
    </h2>
    <p id="p">GeeksforGeeks</p>
 
 
    <button onclick="geek()">Click me!</button>
    <script>
    function geek() {
        document.getElementById("p").innerHTML =
        "A computer science portal for geeks.";
    }
    </script>
</body>
 
</html>

Producción:

Propiedad HTML interna

Ejemplo 2: este ejemplo muestra cómo obtener el valor de la etiqueta de párrafo mediante la propiedad innerHTML.

HTML

<!DOCTYPE html>
<html>
 
<body style="text-align: center">
    <h1 style="color:green">
        GeeksforGeeks
    </h1>
    <h2>
        DOM innerHTML Property
    </h2>
    <p id="P">A computer science portal for geeks.</p>
 
 
    <button onclick="geek()">Try it</button>
    <p id="p"></p>
 
 
     
    <script>
    function geek() {
        var x = document.getElementById("P").innerHTML;
        document.getElementById("p").innerHTML = x;
        document.getElementById("p").style.color = "green";
    }
    </script>
</body>
 
</html>

Producción:

Propiedad HTML interna

Navegadores compatibles: los navegadores compatibles con la propiedad DOM innerHTML se enumeran a continuación:

  • Google Chrome 33.0 y superior
  • Internet Explorer 4 y superior
  • Microsoft Edge 12.0 y superior
  • Firefox 1.0 y superior
  • Ópera 8.0 y superior
  • Safari 9.0 y superior

Publicación traducida automáticamente

Artículo escrito por Vishal Chaudhary 2 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *