我读到 Three.js 需要 HTML5 <canvas>元素。不过，我可以完美地制作一个简单的 <div>为其提供高度和宽度属性，然后添加 WebGLRenderer.domElement因为它是 HTML 层次结构中的子级。奇怪的是，如果我使用<canvas>，它就不起作用了。而不是 <div> ，因为场景保持全黑。
使用其中一种有什么区别？每种情况下的方法应有何不同？
我的理论是<div>如果设置了尺寸，元素可以用作 Canvas ，并且还具有元素所具有的所有优点，但浏览器仍然需要支持 HTML5 <canvas>元素以便正常工作，但我希望得到有更多知识的人的确认。
最佳答案
有两种方法。您可以将渲染器的 DOM 元素(即 <canvas> 元素)附加到您所做的另一个 DOM 元素(如果您查看 <div> 内部，您将找到 <canvas> )，或者将引用放在已存在<canvas>在渲染器的构造函数中:
renderer = new THREE.WebGLRenderer({ canvas: document.querySelector('canvas') })
在这两种情况下，您都会有 <canvas>运行时 DOM 中的元素。唯一的区别是，使用第一种方法时，您将其从脚本内部附加到 DOM，而使用第二种方法时，您在 HTML 文档中预定义它。
关于javascript - 在 Three.js 场景中使用 div 和 canvas 元素有什么区别？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/52288404/