Solucionado
Duvida 1 : Qual a finalidade de:
<!-- fracao.html -->Duvida 2: Pq o instrutor insere o codigo a seguir em todas as funcoes? Inseri no comeco do meu codigo uma unica vez e funcionou normal
var tela = document.querySelector('canvas');
var pincel = tela.getContext('2d');Obrigada mais uma vez =)
Oi, Pâmela! Tudo bem?
Sua primeira dúvida
<!-- fracao.html -->nada mais é do que um comentário dizendo que se trata de um arquivo chamado fracao.html.
Durante todo seu código você pode fazer comentários com a finalidade de tornar compreensível para quem ler ou mesmo para suas próprias anotações. Quando usamos // na frente dos comentários, eles ficam invisíveis ao rodar no programa que esteja usando.
A segunda dúvida
var tela = document.querySelector('canvas');
var pincel = tela.getContext('2d');temos que dividir em duas partes:
Quando colocamos nosso canvas
<canvas width="700" height="500"></canvas>estamos estipulando o tamanho do "quadro" que queremos trabalhar. Feito isso, vamos para o próximo
document.querySelector('canvas');estamos "selecionando" quem queremos trabalhar, que no caso é o canvas que defini os parâmetros no começo. Agora queremos desenhar dentro desse canvas
tela.getContext('2d');representando uma renderização bidimensional (2d).
Resumindo a segunda dúvida, seria dessa forma:
Dado este elemento :
<canvas width="700" height="500"></canvas>Você pega um contexto 2d do canvas com o código a seguir:
var tela = document.querySelector('canvas');
var pincel = tela.getContext('2d');Agora você tem contexto de renderização 2d para o canvas e você pode desenhar nele.
Espero ter ajudado, Pâmela!
Bons estudos!