ChildNode#

ChildNode.nextElementSibling#

Właściwość nextElementSibling zwraca pierwszego następnika bratowego (będącego elementem) dla danego węzła. Jeśli węzeł nie posiada żadnego następnika bratowego spełniającego te wymagania to zwrócona zostanie wartość null. Właściwość jest tylko do odczytu.

Opis działania#

Samo wywołanie i poszczególne jego części najlepiej objaśnić na zapisie składniowym:

  1. —
  2. L
  3. K
  4. T'
  5. T
  6. A
  7. O
  8. Z'
  9. Z
  10. #
var next_element = childNode.nextElementSibling;

gdzie poszczególne człony oznaczają:

Prosty przykład:

  1. —
  2. L
  3. K
  4. T'
  5. T
  6. A
  7. O
  8. Z'
  9. Z
  10. #
<!DOCTYPE html>
<html>

<head>

	<script>

		function getNextSibling(method){

			var p2 = document.getElementById("p2"); // referencja do drugiego akapitu
			var nextSibling = null;
			var methodText = "";

			if (method == "method1"){
				nextSibling = p2.nextElementSibling;
				methodText = "Polecenie: nextElementSibling";
			}

			else if (method == "method2"){
				nextSibling = p2.nextSibling;
				methodText = "Polecenie: nextSibling";
			}

			var info = document.getElementById("info");

			info.innerHTML = methodText
					+ "<br>" + "Interfejs pobranego węzła: " + nextSibling
					+ "<br>" + "Właściwość nodeName: " + nextSibling.nodeName
					+ "<br>" + "Właściwość textContent: " + nextSibling.textContent;

		}

	</script>

</head>

<body>
	<p>Pierwszy akapit w BODY.</p>
	<!-- Pierwszy komentarz HTML --><p id="p2">Drugi akapit w BODY.</p><!-- Drugi komentarz HTML -->
	<p>Trzeci akapit w BODY.</p>

	<p>Kliknij konkretny przycisk by pobrać brata następującego dla drugiego akapitu.</p>
	<input type="button" value="nextElementSibling" onclick="getNextSibling('method1')">
	<input type="button" value="nextSibling" onclick="getNextSibling('method2')">

	<p style="color: blue;">Szczegółowe informacje o sposobie:</p>
	<p id="info"></p>
</body>

</html>

Właściwość nextElementSibling pojawia się dopiero w specyfikacji DOM4. W przeszłości była ona definiowana dla interfejsu ElementTraversal w osobnej specyfikacji Element Traversal Specification.

Składnia Web IDL#

  1. —
  2. L
  3. K
  4. T'
  5. T
  6. A
  7. O
  8. Z'
  9. Z
  10. #
[NoInterfaceObject]
interface ChildNode {
	readonly attribute Element? nextElementSibling;
}

Specyfikacje i inne materiały#

Pasek społecznościowy

SPIS TREŚCI AKTUALNEJ STRONY

ChildNode (H1) ChildNode.nextElementSibling (H2) Opis działania (H3) Składnia Web IDL (H3) Specyfikacje i inne materiały (H3)