Happy Cats
Consider this implementation of a cat in Scratch that counts from 1 toward infinity:
-
(4 points.) Complete the reimplementation of that same cat in JavaScript, below, in such a way that the cat (aka
cat.png
) counts from 1 toward infinity by updating thevalue
of#count
once per second. You might findwindow.setInterval
of interest!<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1, width=device-width"> <script> document.addEventListener('DOMContentLoaded', function() { // TODO }); </script> <style> #cat { max-width: 50%; } #count { font-size: xx-large; vertical-align: top; } </style> <title>count</title> </head> <body> <img alt="cat" id="cat" src="https://cdn.cs50.net/2020/fall/test/cats/cat.png"> <input id="count" readonly type="text"> </body> </html>
Consider this implementation of a cat in Scratch that meows anytime it is clicked:
-
(4 points.) Complete the reimplementation of that same cat in JavaScript, below, in such a way that the cat (aka
cat.png
) meows (by playingmeow.mp3
) anytime it is clicked, one meow per click. You might findaudio
andplay
of interest!<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1, width=device-width"> <script> document.addEventListener('DOMContentLoaded', function() { // TODO }); </script> <style> #cat { max-width: 50%; } </style> <title>meow</title> </head> <body> <img alt="cat" id="cat" src="https://cdn.cs50.net/2020/fall/test/cats/cat.png"> <audio> <source src="https://cdn.cs50.net/2020/fall/test/cats/meow.mp3" type="audio/mpeg"> </audio> </body> </html>