首页 > 解决方案 > 无法在 JavaScript 画布中加载或显示桨(需要移动)

问题描述

当我运行并检查控制台显示“错误 document.documentElement 不是函数”时,我试图用鼠标控件(在 x 上)加载一个桨......现在我试图弄清楚但我仍然有没有用,我正在使用 udemy 课程,但我尝试制作一个带有碰撞的桨和一个带有许多奇怪元素的球弹跳的球并没有太大帮助,有些太长了,我什至不能说它们哈哈

<html>

 <body>
     <canvas id="gameCanvas" width="800" height="600"></canvas>
  </body>
    <script>
   var ballX = 100
      var ballspeedX = 5
 var ballY = 100
 var ballspeedY = 5

 const PADDLE_WIDTH = 100
 const PADDLE_THICKNESS = 10
   var paddleX = -100

   var canvas
   var canvasContext

function updateMousePos(evt) {

   var rect = canvas.getBoundingClientRect()
     var root = document.documentElement();

    var mouseX = evt.clientX - rect.left - root.scrollLeft
      paddleX = mouseX

    }

    window.onload = function() {

       canvas = document.getElementById("gameCanvas")
    canvasContext = canvas.getContext("2d")

        var fps = 30

    setInterval(updateAll, 100)


  canvas.addEventListener("mousemove", updateMousePos)
  }

标签: javascripthtml

解决方案


定义根变量时,您需要从 document.documentElement 中删除括号;


推荐阅读