活字格中中js操作

妄想社成员

各位大佬，请问在网页js代码中document.getElementById("3dAnime").appendChild(xxxx
);到活字格js中应该如何改写？在活字格中我如何能拿到页面上的元素？页面上的元素是否支持appendChild操作？
以下为源码

<html><head> <meta charset="utf-8"> <title>My first three.js app</title> <style> body { margin: 0; } </style></head><body>  <div style="float: left;display: block; margin: 0;padding: 0; width: 50; height: 720;background-color: aqua;"> <p style="margin: 0;padding: 0;font-size: 30px;color: black;">侧边栏宽50</p> </div> <div id="3dAnime" style="float: left;display: block; margin: 0;padding: 0; width: 1280; height: 720;"></div>  <script src="Three/three.min.js"></script> <script> const scene = new THREE.Scene(); const camera = new THREE.PerspectiveCamera(75, 1280 / 720, 0.1, 1000); const renderer = new THREE.WebGLRenderer(); renderer.setSize(1280, 720); document.getElementById("3dAnime").appendChild(renderer.domElement); const geometry = new THREE.BoxGeometry(); const material = new THREE.MeshBasicMaterial({ color: 0x00ff00 }); const cube = new THREE.Mesh(geometry, material); scene.add(cube); camera.position.z = 5; function animate() { requestAnimationFrame(animate); cube.rotation.x += 0.01; cube.rotation.y += 0.01; renderer.render(scene, camera); }; animate(); </script></body> </html>