JavaScript DOM HTML property: previousElementSibling
[this page | pdf | back links]
The previousElementSibling
property of HTML
elements within the JavaScript
DOM returns
the previous element at same node tree level of the element.
EXAMPLE:
HTML USED IN THIS EXAMPLE:
<!DOCTYPE html>
<html> <!-- Copyright (c) Nematrian Limited 2018 -->
<head></head>
<body>
<p>See JavaScript. Following paragraph contains</p>
<p id="x0">[A] <span id="x1">[B] </span><span id="x2">[C] </span></p>
(where [B] and [C] are in elements, [A] and [D] in nodes)
<p id="x3"></p>
<script>
var n0 = document.getElementById("x0");
var txt = document.createTextNode("[D]");
n0.appendChild(txt);
var n1 = document.getElementById("x1");
var n2 = document.getElementById("x2");
var n3 = document.getElementById("x3");
n3.innerHTML = "Then the contents of different nodes / elements are: <br><br>"
+ "firstChild of paragraph: " + n0.firstChild.textContent +"<br>"
+ "firstElementChild of paragraph: " + n0.firstElementChild.textContent + "<br>"
+ "lastChild of paragraph: " + n0.lastChild.textContent + "<br>"
+ "lastElementChild of paragraph: " + n0.lastElementChild.textContent + "<br>"
+ "nextElementSibling of B: " + n1.nextSibling.textContent + "<br>"
+ "nextSibling of C: " + n2.nextSibling.textContent + "<br>"
+ "previousElementSibling of C: " + n2.previousElementSibling.textContent + "<br>"
+ "previousSibling of B: " + n1.previousSibling.textContent + "<br>"
+ "lastElementChild of parent of B: " + n1.parentNode.lastElementChild.textContent;
</script>
</body>
</html>
|
NAVIGATION LINKS
Contents | Prev | Next | JavaScript DOM (and BOM)