猿问

使用console.log在canvas中进行javascript故障排除

我正在尝试对一些 javascript 代码进行故障排除,但我无法在 html 画布上显示任何 console.log 信息,以便我可以看到变量的值。有这样做的基本方法吗?


// JavaScript Document

/*jshint esversion: 6 */


const canvas = document.getElementById('canvas1');

const ctx = canvas.getContext('2d');

canvas.width = window.innerWidth;

canvas.height = window.innerHeight;

console.log("Hello world!");

alert("Just executed this code!");

canvas {

   position: absolute;

   top: 0; 

    left: 0;

     width: 100%;

     height: 100%;

   background: rgba(10,10,153,0.5);

}

<!doctype html>

<html>

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie-edge">

    <title>Art01a2020</title>

    <link rel="stylesheet" href="style4.css">

</head>


<body>

    <canvas id="canvas1"></canvas>

    <script type="text/javascript" src="script4.js"></script>


</body>

</html>


沧海一幻觉
浏览 187回答 1
1回答

元芳怎么了

console.log 不会在画布中记录内容,它会在资源管理器的开发者控制台上输出F12,如果您想调试画布中的内容,您可以使用fillText 方法在画布上输出带有变量的文本。例子:ctx.fillText(some_variable, screen_x_position, screen_y_position);
随时随地看视频慕课网APP

相关分类

JavaScript
我要回答