ChildNode#
ChildNode.previousElementSibling#
Właściwość previousElementSibling
zwraca pierwszego poprzednika bratowego (będącego elementem) dla danego węzła. Jeśli węzeł nie posiada żadnego poprzednika 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:
var previous_element = childNode.previousElementSibling;
gdzie poszczególne człony oznaczają:
- previous_element - referencja do pierwszego poprzednika bratowego (elementu) dla danego węzła lub wartość
null
. - childNode - węzeł będący obiektem kontekstu.
Prosty przykład:
<!DOCTYPE html>
<html>
<head>
<script>
function getPreviousSibling(method){
var p2 = document.getElementById("p2"); // referencja do drugiego akapitu
var previousSibling = null;
var methodText = "";
if (method == "method1"){
previousSibling = p2.previousElementSibling;
methodText = "Polecenie: previousElementSibling";
}
else if (method == "method2"){
previousSibling = p2.previousSibling;
methodText = "Polecenie: previousSibling";
}
var info = document.getElementById("info");
info.innerHTML = methodText
+ "<br>" + "Interfejs pobranego węzła: " + previousSibling
+ "<br>" + "Właściwość nodeName: " + previousSibling.nodeName
+ "<br>" + "Właściwość textContent: " + previousSibling.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 poprzedzającego dla drugiego akapitu.</p>
<input type="button" value="previousElementSibling" onclick="getPreviousSibling('method1')">
<input type="button" value="previousSibling" onclick="getPreviousSibling('method2')">
<p style="color: blue;">Szczegółowe informacje o sposobie:</p>
<p id="info"></p>
</body>
</html>
Właściwość previousElementSibling
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#
[NoInterfaceObject] interface ChildNode { readonly attribute Element? previousElementSibling; }
Specyfikacje i inne materiały#
Pasek społecznościowy