HTML DOM console.group() 方法
htmlweb developmentfront end technology更新于 2025/9/24 19:56:17
HTML DOM console.group() 方法用于指示消息组的起始位置,所有在该方法之后写入的消息都将写入该消息组。这允许使用 label 参数为所有消息创建一个组或创建多个组。
语法
以下是 console.group() 方法的语法 −
console.group([label])
其中,label 是一个可选参数。它是字符串类型,用作所创建消息组的标签。
示例
让我们来看一个 HTML DOM console.group() 方法的示例 −
<!DOCTYPE html>
<html>
<body>
<h1>console.group() Method</h1>
<p>Press F12 key to view the message in the console view.</p>
<button type="button" onclick="normMessage()">NORMAL</button>
<button type="button" onclick="groupMessage()">GROUP</button>
<script>
function normMessage(){
console.log("Hello world!");
}
function groupMessage(){
console.group();
console.log("This message will be inside a group!");
console.log("This message will also be inside a group!");
}
</script>
</body>
</html>
输出
这将产生以下输出 −

点击"普通"按钮并查看控制台 −

点击"群组"按钮并查看控制台 −

在上面的例子中 −
我们创建了两个按钮 NORMAL 和 GROUP,当用户点击它们时,它们会执行 normMessage() 和 groupMessage() 方法。
<button type="button" onclick="normMessage()">NORMAL</button> <button type="button" onclick="groupMessage()">GROUP</button>
normMessage() 方法包含 console.log() 方法,该方法接受一个字符串或对象作为参数,并将其简单地显示在控制台上 −
function normMessage(){
console.log("Hello world!");
}
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!");
}
相关文章
有用资源
html 参考教程 - 该教程包含有关 html 的更多信息:https://www.cainiaomax.com/html/

