JavaScript parentElement method

JavaScript's parentElement() method returns reference to the parent element of the specified element.

JavaScript parentElement method

JavaScript parentElement method

     

JavaScript's parentElement() method returns reference to the parent element of the specified element. By using the parentElement() method we can obtain any element's parent element object reference which may be very useful while we have many overlapped elements and we are not able to find the exact references to the parent elements.

Syntax :

document.elementObject.parentElement();

Where elementObject is the object of which parentElement reference we have to take. Here is the full HTML code of parentElementExample.html as follows:

 

 

 

<html>
  <head>
    <title>parentElement method</title>
    <script language="JavaScript">
	function callParentElement() {
	  var range = document.selection.createRange();
	  var parElement = range.parentElement();
	  parElement.innerText = 'ParentElement'; 
	} 
    </script>
  </head>
  <body>
    <div style="background: #99ffcc; width:'100%';" 
          align="center">
      <font color="#ff0000" size="12pt">
	<b>parentElement method example</b>
      </font>
    </div>
   <center>
     <p>&nbsp;</p>
	<input type="button" value="Call Parent"
            onclick="callParentElement();">
   </center>
  </body>
</html>

Output :

Click on the button "Call Parent", it will find the parent element and will take the reference of it into an object variable.

Download Source Code