Почему не срабатывает событие "клик" ? addeventlistener

Question

У меня есть js код

let Mybutton = document.getElementById("btn");
let div_id = document.querySelector(".blockForChat");
Mybutton.addEventListener("click", function() {div_id.style.height = 1000 + "px";});

И html код

<div class='blockForChat' id='block'><h6 id='text'><font color='#FF586E' size=4>Test</font></h6>

<form>
  
  <input type='text' maxlength="302" size="40" placeholder="Ваше сообщение здесь">
  <input id='btn' type='button' value="Отправить">
</form>

Почему кнопка не обрабатывается?
P.S. я новичок в js

Answer 1

let Mybutton = document.getElementById("btn");
let div_id = document.getElementById("block");

function functionName(event) {
    event.preventDefault();
    div_id.style.height = 1000 + "px";
}

Mybutton.addEventListener("click", functionName);

<!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" />
        <title>Document</title>
    </head>
    <body>
        <div class="blockForChat" id="block">
            <h6 id="text">
                <font color="#FF586E" size="4">Test</font>
            </h6>
        </div>

        <form>
            <input
                type="text"
                maxlength="302"
                size="40"
                placeholder="Ваше сообщение здесь"
            />
            <input id="btn" type="submit" value="Отправить" />
        </form>

        <script src="/script.js"></script> 
    </body>
</html>

БЛОГ НА HUSL

Почему не срабатывает событие "клик" ? addeventlistener

Ответы (1 шт):