的jQuery相當於得到一個帆布

Question

的背景下，我有以下工作代碼：

ctx = document.getElementById("canvas").getContext('2d'); 

有什麼辦法重新寫它使用$？這樣做失敗：

ctx = $("#canvas").getContext('2d'); 

Answer 1

嘗試：

$("#canvas")[0].getContext('2d'); 

jQuery的暴露了實際的DOM元素在數字指標，在這裏你可以進行正常的JavaScript/DOM功能。

Answer 2

我也看到，它通常優選使用獲得（0）來引用一個jQuery目標爲HTML元素：因爲jQuery的作爲返回null

var myCanvasElem = $("#canvas").get(0); 

也許是爲了避免任何潛在的空對象引用對象，但是從不用彷徨元件工作（0）可能不會失敗，因此默默的......你可以很容易地檢查畫布首次發現獲得（0）像

if($("#canvas").length) ctx = $("#canvas").get(0).getContext('2d'); 
else console.log('Error: Canvas not found with selector #canvas'); 

Answer 3

該腳本之前找到之前「帆布」

$(document).ready(function() { 
    ctx = $("#canvas"); 
});