HTML DOM console.groupEnd() 메서드는 메시지 그룹의 끝을 나타내는 데 사용됩니다. 콘솔의 현재 메시지 그룹을 종료합니다.
구문
다음은 console.groupEnd() 메서드의 구문입니다. -
console.groupEnd()
예시
HTML DOM console.groupEnd() 메서드의 예를 살펴보겠습니다. -
<!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> 출력
이것은 다음과 같은 출력을 생성합니다 -

GROUP 버튼을 클릭하고 개발자 옵션에서 콘솔 보기를 볼 때 -

END GROUP 버튼을 클릭하고 개발자 옵션에서 콘솔 보기를 볼 때 -

위의 예에서 -
사용자가 클릭하면 groupMessage() 및 EndGroup() 메서드를 실행하는 두 개의 버튼 GROUP 및 END GROUP을 만들었습니다. -
<button type="button" onclick="groupMessage()">GROUP</button> <button type="button" onclick="EndGroup()">END GROUP</button>
groupMessage() 메서드에는 이 시점 이후에 작성된 모든 메시지가 메시지 그룹 내부에 표시된다는 내용의 console.group() 메서드가 있습니다. -
function groupMessage(){
console.group();
console.log("This message will be inside a group!");
console.log("This message will also be inside a group!");
} EndGroup() 메서드에는 이 시점 이후에 작성된 모든 메시지가 메시지 그룹 외부에 표시된다는 내용의 console.groupEnd() 메서드가 내부에 있습니다. 이전에 메시지 그룹이 존재하지 않으면 오류가 발생하지 않습니다 -
function EndGroup(){
console.groupEnd();
console.log("We are now outside the group");
console.log("This message will be outside the group!");
}