如何在Canvas中自动显示文字并延迟隐藏 - JavaScript示例 - 常规

<p>{&quot;title&quot;:&quot;如何在Canvas中自动显示文字并延迟隐藏 - JavaScript示例&quot;,&quot;description&quot;:&quot;本教程演示了如何使用JavaScript在Canvas中自动显示文字并在两秒后隐藏。使用<code>fillText</code>方法绘制文字，并使用<code>setTimeout</code>函数延迟清除Canvas内容。&quot;,&quot;keywords&quot;:&quot;Canvas, JavaScript, 文字显示, 隐藏文字, setTimeout, clearRect,  示例代码&quot;,&quot;content&quot;:&quot;&quot;<!DOCTYPE html>\n<html>\n<body>\n    &lt;canvas id=&quot;myCanvas&quot; width=&quot;400&quot; height=&quot;200&quot;&gt;</canvas>\n\n    <script>\n        var canvas = document.getElementById(&quot;myCanvas&quot;);\n        var ctx = canvas.getContext(&quot;2d&quot;);\n        var text = &quot;Hello, World!&quot;;\n\n        ctx.font = &quot;30px Arial&quot;;\n        ctx.fillText(text, 50, 50);\n\n        setTimeout(function() {\n            ctx.clearRect(0, 0, canvas.width, canvas.height);\n        }, 2000);\n    </script>\n</body>\n</html>&quot;\n在上面的示例中，首先获取了canvas元素和2D上下文。然后使用<code>fillText</code>方法在canvas上绘制了文字。之后使用<code>setTimeout</code>函数，在两秒后调用回调函数来清除canvas上的内容，达到隐藏文字的效果。&quot;}</p>