之前仔細研究了imooc上的文章 http://idcbgp.cn/video/4319 ，用手工可以實現(xiàn)了，步驟和思路是：document.getElementById('Canvas').style.display = "block"; //原來canvas樣式只有position為absolute,display為none這兩個屬性,此時將display改為block,但不加任何fillStyle.     canvas = document.getElementById('Canvas');cxt = canvas.getContext("2d");canvas.width = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;canvas.height = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;//定義canvas環(huán)境cxt.fillStyle='rgba(0,0,0,0.7)';     cxt.rect(0, 0, canvas.width, canvas.height); //定義canvas整體寬度和顏色pathRect(cxt,1496,44,156,35);  //pathRect函數(shù)是根據(jù)非零環(huán)繞原則，定義的是不被涂色的區(qū)域(div)，即我的高亮顏色,這個是第一個不涂色區(qū)域。 pathRect(cxt,270,110,250,250); //定義第2個不涂色區(qū)域。 pathRect(cxt,526,110,250,250); //定義第3個不涂色區(qū)域。 pathRect(cxt,789,110,250,250); //定義第4個不涂色區(qū)域。cxt.fill();      //開始染色，其他區(qū)域都會被染成灰色，除了定義的幾個區(qū)域外。附上之前的函數(shù)，任何時候，只要傳入div_id,就能很容易算出pathRect(cxt,270,110,250,250)后面的4個值了。