Форум

megaLux · #1 (**permalink**) 28.01.2024, 17:20

всем привет
я новичок в javascript

пытаюсь делать вставку javascript в <canvas> и закрасить прямоугольник:

<html>
	<body>
		<canvas width="200" height="200">
			<script>
				var doc = document.getElementById("myCanvas")
				var ctx = doc.getContext("2d")
				ctx.beginPath()
				ctx.rect(20, 20, 150, 100)
				ctx.fillStyle = "red"
				ctx.fill()
			</script>
		</canvas>
	</body>
</html>

браузер ничего не выводит
подскажите где ошибка?

рони · #2 (**permalink**) 28.01.2024, 19:34

megaLux,
строка 3, отсутствует id, на который ссылается строка 5.

megaLux · #3 (**permalink**) 28.01.2024, 20:10

<canvas id="myCanvas" width="200" height="200">

спасибо

voraa · #4 (**permalink**) 28.01.2024, 20:27

И не надо без большой надобности впихивать javascript среди тегов html.
У него есть вполне определенные места в начале (в head) или в конце body

<html>
    <body>
        <canvas id="myCanvas" width="200" height="200">
        </canvas>
        
<script>

    var doc = document.getElementById("myCanvas")
    var ctx = doc.getContext("2d")
    ctx.beginPath()
    ctx.rect(20, 20, 150, 100)
    ctx.fillStyle = "red"
    ctx.fill()

</script>

    </body>
</html>

Форум

Справочник

Discord чат

Курсы javascript