0
document.querySelectorAll('#a,#b,#c').onmouseover = event => {
    event.target.innerText = event.target.innerText.split("").map(letter => letters[Math.floor(Math.random()*36)]).join("");
}

I tried running this line of code ,but sadly this just gave me an error

I tried this code.I was expecting few random letters replacing the main words when the mouse was moved over any particullar h1 but instead I just encountered an error.

const letters = "ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789";

document.querySelectorAll('#a,#b,#c').onmouseover = event => {
    event.target.innerText = event.target.innerText.split("").map(letter => letters[Math.floor(Math.random()*36)]).join("");
}

@import url('https://fonts.googleapis.com/css2?family=Space+Mono&display=swap');
*{
    border: 0;
    margin: 0;
    box-sizing: border-box;
}
body{
    display: grid;
    place-items: center;
    height: 100vh;
    background-color: black;
    margin: 0rem;
    overflow: hidden;
}
h1{
    font-family: 'Space Mono', monospace;
    color: blueviolet;
    font-size: 5rem;
    letter-spacing: 0.3rem;
    text-align: center;
    line-height: 200px;
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="style.css">
    <title>Hacker_Effect ‍</title>
</head>
<body>
        <h1 id="a">DEPLOY</h1>
        <h1 id="b">ARMOURY</h1>
        <h1 id="c">ARSENAL</h1>
</body>
<script src="index.js"></script>
</html>
TheBoy
  • 1
  • 1
  • What was the error message? Take a close look at what [document.querySelectorAll()](https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelectorAll) actually returns. – mykaf Apr 12 '23 at 14:18

0 Answers0