Javascript 选择单个框并向其添加css

我有创建网格的代码

相关的HTML部分是：

而Javascript代码段：

var canvas=document.getElementById（“网格”）；
var ctx=canvas.getContext（'2d'）；
varⅠ，j；
功能网格（x、y、wid、高度）{
ctx.beginPath（）；
//绘图网格
对于（i=0；我不在
canvas
中引入
css
。在canas中有许多（重新绘制）选项可以实现这一点。实际上，我不只是想绘制一个框，我还想添加一些行为，例如当有人单击它做某事时。因此，我需要选择一个特定的框（我说得对吗？）。使用画布时，您只需绘制位图图像。使用svg元素或d3.js库来满足您的要求
 var canvas = document.getElementById("grid");
            var ctx = canvas.getContext('2d');
            var i ,j;

function grid(x, y, wid, height) {
            ctx.beginPath();
                //Drawing Grid 
            for(i=0; i <= height; i+=x) {
                ctx.moveTo(0, i);
                ctx.lineTo(wid, i);
             }

            for(j=0; j <= wid; j+=y) {
                ctx.moveTo(j, 0);
                ctx.lineTo(j, height);
             }
            }

            // Function to draw grid
            //grid(x, y, width, height);
            grid(10, 10, 400, 400);

            ctx.strokeStyle = "#fff";
            ctx.stroke();