Selectores y métodos find y getAll¶

Usando el método find, es posible seleccionar un grupo de objetos y aplicarles un método o manejador de evento. para esto debemos pasar un selector:

• tipo: Corresponde con el nombre del método usado para crear el objeto (circle, rect, line...).
• id: Un nombre que damos a un objeto con el fin de diferenciarlo de otros del mismo tipo.

Imagine que esta creando un buscaminas, habrán varios rectángulos, unos serán minas y otros no. Todos los rectángulos tienen el mismo color, pero los rectángulos mina explotan y terminan el juego, mientras los demás aumentan los puntos del jugador.

Nota Al igual que en css, el símbolo # indica que mina y safe son id.

for (var i = 0; i < 5; i++) {
    ce.rect(i*10, 0, 10).addId("mina");
}

for (var i = 0; i < 5; i++) {
    ce.rect(i*10, 10, 10).addId("safe");
}

// seleccionar rectángulos, tanto #mina como #safe
ce.find("rect").attr("fill", "green");

// rectángulos #mina explotan
ce.find("#mina").click(function(c, e) {
    alert("Boom!");
    alert("Game Over");
});

// rectángulos #safe aumentan un punto
ce.find("#safe").click(function(c, e) {
    puntos += 1;
});

Por otro lado el método getAll retorna un array con los objetos seleccionados con el selector

// encontrar y retornar los objetos rect dibujados hasta el momento
var rects = ce.findAll("rect");

// obtener el primer circulo dibujado
var first_circle = ce.getAll("circle")[0];