HTML DOM console.groupEnd() Method


The HTML DOM console.groupEnd() method is used for indicating the end of a message group. It exits the current message group in the console.

Syntax

Follwing is the syntax for console.groupEnd() method −

console.groupEnd()

Example

Let us see an example for the HTML DOM console.groupEnd() method −

<!DOCTYPE html>
<html>
<body>
<h1>console.groupEnd() Method</h1>
<p>Press F12 key to view the message in the console view.</p>
<button type="button" onclick="groupMessage()">GROUP</button>
<button type="button" onclick="EndGroup()">END GROUP</button>
<script>
   function groupMessage(){
      console.group();
      console.log("This message will be inside a group!");
      console.log("This message will also be inside a group!");
   }
   function EndGroup(){
      console.groupEnd();
      console.log("We are now outside the group");
      console.log("This message will be outside the group!");
   }
</script>
</body>
</html>

Output

This will produce the following output −

On clicking the GROUP button and looking at the console view in developer options −

On clicking the END GROUP button and looking at the console view in developer options −

In the above example −

We have created two buttons GROUP and END GROUP that will execute the groupMessage() and EndGroup () method upon being clicked by the user −

<button type="button" onclick="groupMessage()">GROUP</button>
<button type="button" onclick="EndGroup()">END GROUP</button>

The groupMessage() method has the console.group() method inside it stating all the messages written after this point will be displayed inside a message group −

function groupMessage(){
   console.group();
   console.log("This message will be inside a group!");
   console.log("This message will also be inside a group!");
}

The EndGroup() method has the console.groupEnd() method inside it stating all of the messages written after this point will be displayed outside the message group. It won’t throw an error if no message group existed before −

function EndGroup(){
   console.groupEnd();
   console.log("We are now outside the group");
   console.log("This message will be outside the group!");
}
raja
Published on 08-Aug-2019 15:43:03
Advertisements