HTML DOM console.timeEnd() 方法
htmlweb developmentfront end technology更新于 2025/9/24 18:20:17
console.timeEnd() 方法用于停止计时器并显示 console.time() 和 console.timeEnd() 代码执行完成所用的时间。它有助于对代码的各个部分进行计时，找出瓶颈所在。使用可选的 label 参数，我们可以指定要停止的计时器。
语法
以下是 console.timeEnd() 方法的语法 −
console.timeEnd(label);
其中，label 是一个可选参数，用于指定要停止的计时器。
示例
让我们来看一个 console.timeEnd() 方法的示例 −
<!DOCTYPE html>
<html>
<body>
<h1>console.time() Method</h1>
<p>Click the below button to time the for,while and do-while loops for 100000 iterations </p>
<button type="button" onclick="LoopPerform()">TIMER</button>
<script>
var i,j,k;
i=0,j=0,k=0;
function LoopPerform(){
console.time("for-loop");
for (; i < 100000; i++){}
console.timeEnd("for-loop");
console.time("while-loop");
while(j<100000)
j++;
console.timeEnd("while-loop");
console.time("do-while loop");
do{k++;}
while(k<100000);
console.timeEnd("do-while loop");
}
</script>
<p>Press F12 key to view the performance result in your console view</p>
</body>
</html>
输出
这将产生以下输出 −
点击 TIMER 按钮 −
在上面的例子中 −
我们首先创建了一个 TIMER 按钮，当用户点击该按钮时，它将执行 LoopPerform() 函数 −
</button type="button" onclick="LoopPerform()">TIMER</button>
LoopPerform() 函数内部执行 for、while 和 do-while 循环。总共创建了三个计时器，标签分别为"for-loop"、"while-loop"和"do-while loop"，用于衡量这三个循环的性能。
console.time() 方法启动计时器，并接受一个可选的标签参数，用于计算其中代码执行所用的时间。console.timeEnd() 方法用于停止计时器并在控制台视图中显示结果。在 timeEnd() 方法中使用标签作为参数，我们可以指定要停止哪个计时器 −
function LoopPerform(){
console.time("for-loop");
for (; i < 100000; i++){}
console.timeEnd("for-loop");
console.time("while-loop");
while(j<100000)
j++;
console.timeEnd("while-loop");
console.time("do-while loop");
do{k++;}
while(k<100000);
console.timeEnd("do-while loop");
}
相关文章
有用资源
html 参考教程 - 该教程包含有关 html 的更多信息:https://www.cainiaomax.com/html/
