javascript - bir Canvas'ın bağlamını alma için jQuery eşdeğeri

Aşağıdaki çalışan koda sahibim:

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

Bunu $ kullanacak şekilde yeniden yazmanın bir yolu var mı? Bunu yapmak başarısız oluyor:

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

Cevap #1

Denemek :

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

jQuery, normal JavaScript/DOM işlevlerini gerçekleştirebileceğiniz sayısal indekslerde gerçek DOM öğesini ortaya çıkarır.

Cevap #2

Ayrıca, bir jQuery hedefini HTML öğesi olarak referans vermek için genellikle .get(0) kullanmanın tercih edildiğini de gördüm:

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

Belki de olası herhangi bir null nesne referansını önlemeye yardımcı olmak için, çünkü jQuery null'ü bir nesne olarak döndürür, ancak .get(0) ile öğe ile çalışmak sessizce başarısız olmayabilir... .get(0) yapmadan önce canvas'ın bulunup bulunmadığını kolayca kontrol edebilirsiniz, örneğin

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