Javascript 为什么我不能划一条线？

我正在试着从矩形的左上角到中心画一条线？矩形会出现，但不是直线

  <script type="text/javascript">
    var canvas = document.getElementById("canvas");
    var ctx = canvas.getContext("2d");

    ctx.strokeRect(10,10,300,175);
    ctx.moveTo(10,10);
    ctx.lineTo(140, 87);
 </script>

var canvas=document.getElementById（“canvas”）；
var ctx=canvas.getContext（“2d”）；
ctx.strokeRect（10,10300175）；
ctx.moveTo（10,10）；
ctx.lineTo（140,87）；

（这在body标签内）

您需要在

行之后调用to

：

Canvas 2D API的CanvasRenderingContext2D.stroke（）方法使用非零缠绕规则，使用当前笔划样式笔划当前或给定路径

var canvas=document.getElementById（“canvas”）；
var ctx=canvas.getContext（“2d”）；
ctx.moveTo（10,10）；
ctx.lineTo（140,87）；
ctx.stroke（）

参见：

Canvas 2D API的CanvasRenderingContext2D.lineTo（）方法使用一条直线（但实际上不绘制它）将子路径中的最后一点连接到x，y坐标

使用

stroke（）

方法实际绘制线条

var canvas=document.getElementById（“canvas”）；
var ctx=canvas.getContext（“2d”）；
ctx.strokeRect（10,10,300,175）；
ctx.moveTo（10,10）；
ctx.lineTo（140,87）；
ctx.stroke（）
缺少笔划ctx.stroke（）；