DOM是Web前端領域非常重要的組成部分,不僅在處理HTML元素時會用到DOM,圖形編程也同樣會用到。比如SVG繪圖,各種圖形都是以DOM節點的形式插入到頁面中,這就意味著可以使用DOM方法對圖形進行操作。比如有一個<path id=p1>元素,可以直接用jquery增加click事件$('#p1').click(function(){…})。然而這種DOM處理方法在HTML5的Canvas裡不再適用,Canvas使用的是另外一套機制,無論在Canvas上繪製多少圖形,Canvas都是一個整體,圖形本身實際都是Canvas的一部分,不可單獨獲取,所以也就無法直接給某個圖形增加JavaScript事件。
Canvas的限制在Canvas裡,所有圖形都繪製在幀上,繪製方法不會將繪製好的圖形元素作為一個返回值輸出,js也無法獲取到已經繪製好的圖形元素。比如:
複製代碼