Javascript 将类添加到画布元素HTML5&；CreateJS

我在画布上用for循环生成了5个圆，我想给它们一个类，这样我就可以用jquery控制它们，但我做错了什么。你们能知道发生了什么吗

var stage;
var quantity = 6,
    width = 60,
    height = 60,
    circles = [];

function init(){
    stage = new createjs.Stage("myCanvas");
    stage.width = 500;
    stage.height = 600;
    createjs.Ticker.setFPS(60);
    createjs.Ticker.addEventListener("tick", onTick);
    setupGame();
}

function setupGame() {
    for(var i = 0; i < quantity; i++) {   
         var circle = document.createElement("img");
         circle.setAttribute('src', 'images/circles/circle'+i+'.png');
         circle.className = "circle";
         circle.style.position = "absolute";
         circle.style.left = Math.floor((Math.random() * 100)) + "%";
         circle.style.top = Math.floor((Math.random() * 100)) + "%";
         circle.style.width = width + "px";
         circle.style.height = height + "px";
         document.body.appendChild(circle);
         circles.push(circle);
    }
}

function onTick(e){
    stage.update(e);
}

var阶段；
变量数量=6，
宽度=60，
高度=60，
圆圈=[]；
函数init（）{
stage=newcreatejs.stage（“myCanvas”）；
舞台宽度=500；
舞台高度=600；
createjs.Ticker.setFPS（60）；
createjs.Ticker.addEventListener（“勾号”，onTick）；
设置游戏（）；
}
函数setupGame（）{
对于（var i=0；i

新版本。在JonnyD的帮助下，我现在有了一个函数循环。唯一的问题是图像被附加到身体上，而不是我的舞台上。我试过stage.appendChild（圆圈），但它不起作用

---

这里有一个在线源代码的链接，你们可以查看它=

你们的代码有很多错误

您正在尝试向数组中的字符串添加属性，这是不可能的。属性使用点或括号符号添加到对象

点表示法

foo.bar.baz

foo['bar']['baz']

方括号符号

foo.bar.baz

foo['bar']['baz']

我认为您要做的是在“屏幕”上创建五个圆圈，或者在任意位置创建技术上更正确的DOM（），设置H&W为60px，类名为myClass

我已经为您重写了代码，如果您愿意，您可以删除样式javascript行并将其添加到CSS中。。你所做的一切都是错误的：试图将属性添加到数组值，错误的代码技术，以及缺少了宽度、高度之前的样式注意仅向DOM元素添加类名、宽度和高度属性

现在，您可以通过for循环和circles数组或使用CSS的第n个子选择器访问各个圆。e、 圆：第n个子（1）{动画/过渡}

var数量=5，
宽度=60，
高度=60
圆圈=[]；
函数设置（）{
对于（var i=0；i
.circle{
边界半径：50%；
-webkit边界半径：50%；
-moz边界半径：50%；
}
画布中的内容不在DOM中，但图像中的元素在DOM中，可以通过这种方式进行操作

如果方便的话，尝试使用SVG。是一个用于操作SVG的轻量级库。
我没有看到您正在使用CreateJS。。在这种情况下，使用这样的符号是可以的

var circle = new createjs.Shape();
circle.graphics.beginFill("DeepSkyBlue").drawCircle(0, 0, 50);
circle.x = 100;
circle.y = 100;
stage.addChild(circle);

确保您也更新了stage

stage.update();

我意识到这个问题已经得到了回答，但由于我点击这个按钮试图了解如何在jquery中将类添加到画布对象，我将发布如何做到这一点

var thing = canvas_object;
$('body').append(thing);
var canvas = $('canvas');
canvas.addClass('test');

当然，我添加了一个项目的在线链接。圆不是DOM对象，应该使用与createjs库相关的方法。你应该阅读文档，不幸的是，我不能在这方面帮你更多的忙。实际上，我试图实现的是能够在图像/圆（它们是png的）渲染3秒后通过css更改它们的背景位置。但我首先尝试了一些简单的事情，比如隐藏和展示它们。有什么想法吗？你可以使用jCanvas层（使用“name”作为ID，“groups”作为类）来实现。好的，你让我明白了很多，非常感谢。然而，我想要实现的就是这里：。我希望这些圆圈是png的，能够在我的画布上使用它们。我正在使用CreateJS来实现这一点。所以问题是，我如何使用图像而不是生成的形状，以及如何将它们集成到画布中？