Добавить атрибуты холста динамически?

Question

Скажем, у меня есть холст тег в моем HTML5 документа

<canvas id="fooBar" width="500" height="200"></canvas> 

И у меня есть пустой якорь тег

<a href="" id="spin">Spin</a> 

и я строю свой холст в голову

var fooCanvas = document.getElementById("fooBar"); 
var barContext = fooCanvas.getContext("2d"); 

Is есть способ, которым я могу добавить:

barContext.fillText("fubar", x,y); 

Динамически, нажав на значок привязки? Я хочу, чтобы в моей JS была переменная, которая не всегда имеет одно и то же значение, и нажатие тега будет обновлять атрибут canvas fillText при каждом нажатии ссылки. Моя идея преодолеть это - использовать jQuery и что-то вроде этого:

$(document).ready(function(){ 
     $("a").click(function(event){ 
      // Something here 
     }); 
    }); 

Очевидно, что это будет работать на каждый тэг у меня есть в документе, поэтому я уточню, что в дальнейшем, но я не слишком уверен, что на синтаксис требуется, чтобы добавить этот атрибут брезентовый к моему холст? Есть идеи?

Answer 1

Да:

var fooCanvas = document.getElementById("fooBar"); 
var barContext = fooCanvas.getContext("2d"); 

$(document).ready(function(){ 
    $("a").click(function(event){ 
     barContext.fillText("fubar", x,y); 
    }); 
}); 

Хотя вы можете захотеть использовать button элементы вместо a, так как они на самом деле не ссылки.