HTML | Propiedad DOM nextSibling

La propiedad nextSibling se utiliza para devolver el siguiente Node del Node especificado como objeto Node o nulo si el Node especificado es el último de la lista. Es una propiedad de sólo lectura. 

Sintaxis:

node.nextSibling

Valor devuelto: esta propiedad devuelve un hermano siguiente del Node especificado o nulo si el Node actual no tiene ningún hermano siguiente. 

Ejemplo: 

html

<!DOCTYPE html>
<html>
 
<head>
    <title>
      DOM nextSibling Property
    </title>
</head>
 
<body style="text-align: center">
    <h1 style="color:green">
      GeeksforGeeks
    </h1>
 
    <h2>
      DOM nextSibling Property
    </h2>
 
    <div>
        <span id="p1">
            GeeksforGeeks!
        </span><span id="p2">
          A computer science portal for geeks.
        </span>
    </div>
    <br>
 
    <button onclick="geek()">Click me!</button>
    <br>
    <br>
 
    <p id="p" style="margin:auto; width: 40%"></p>
 
    <script>
        function geek() {
            var x =
                document.getElementById("p1").nextSibling.innerHTML;
                document.getElementById("p").innerHTML = x;
                document.getElementById("p").style.color = "white";
                document.getElementById("p").style.background = "green";
        }
    </script>
</body>
 
</html>

Producción: 

Antes de hacer clic en el botón:

 nextSibling 

Después de hacer clic en el botón:

 nextSibling 

Nota: No coloque espacios en blanco entre dos elementos hermanos, de lo contrario, el resultado será «indefinido». 

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

  • Google Chrome 1 y superior
  • Borde 12 y superior
  • Internet Explorer 5.5 y superior
  • Firefox 1 y superior
  • Ópera 7 y superior
  • Safari 1.1 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 *