Какова причина добавления знака вопроса "?" к текущему URL при нажатии на кнопку "Войти" в моем HTML-коде? Вот сам код: <br/> <pre><code class="html"><body>
<div class="login">
<h2></h2>
<form class="login-form">
<input class="login-l" type="login" placeholder="Введите свой логин">
<input class="password" type="password" placeholder="Введите свой пароль">
<button id="butlog">Войти</button>
</form>
</div>
<script src="./js/login.js"></script>
</body></code></pre> <br/> <br/> Также вот код файла ./js/login.js: <br/> <pre><code class="javascript">document.querySelector("#butlog").addEventListener('click', function(){
window.location = "https://vk.com/"
})</code></pre> <br/> <br/>
Чтобы связать HTML-кнопку с JavaScript-кодом для перехода на другую страницу, вы правильно используете обработчик события `click`. Однако, вам нужно предотвратить стандартное поведение формы, которое заключается в отправке формы при нажатии на кнопку. Это именно то, что вызывает добавление знака вопроса "?" к URL, поскольку форма пытается отправить данные на сервер.
Чтобы исправить это, вам нужно использовать метод `event.preventDefault()` внутри вашего обработчика событий. Вот как можно изменить ваш код:
### HTML код:
```html
<body>
<div class="login">
<h2></h2>
<form class="login-form">
<input class="login-l" type="login" placeholder="Введите свой логин">
<input class="password" type="password" placeholder="Введите свой пароль">
<button id="butlog">Войти</button>
</form>
</div>
<script src="./js/login.js"></script>
</body>
```
### JavaScript код (`./js/login.js`):
```javascript
document.querySelector("#butlog").addEventListener('click', function(event) {
event.preventDefault(); // Предотвращаем стандартное поведение кнопки
window.location = "https://vk.com/"; // Переход на другую страницу
});
```
### Объяснение:
1. **event.preventDefault()**: Этот вызов предотвращает выполнение стандартного действия, связанного с отправкой формы. В противном случае, при нажатии на кнопку, форма автоматически отправляется, и браузер добавляет знак вопроса "?" к текущему URL, что указывает на то, что он должен ожидать параметры запроса.
2. **window.location**: С помощью этого свойства вы можете перенаправить пользователя на новую страницу, просто задав нужный URL.
С внесенными правками при нажатии на кнопку "Войти" не произойдет отправка формы, и вы не увидите знак вопроса в URL. Вместо этого вы будете перенаправлены на указанную страницу.
1. <a href="https://stackoverflow.com/questions/31644723/what-is-the-default-button-type" rel="nofollow">What is the default button type?</a> <br/> 2. <a href="https://ru.stackoverflow.com/questions/1216732/%D0%9F%D0%BE%D1%87%D0%B5%D0%BC%D1%83-%D1%82%D0%B5%D0%B3-form-%D0%B2-%D0%BA-%D0%BE%D1%82%D0%BD%D0%BE%D1%81%D0%B8%D1%82%D0%B5%D0%BB%D1%8C%D0%BD%D0%BE%D0%BC%D1%83-%D0%B0%D0%B4%D1%80%D0%B5%D1%81%D1%83-%D0%B4%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D1%8F%D0%B5%D1%82" rel="nofollow">Почему тег form в к относительному адресу добавляет "?"</a> <br/> 3. <a href="https://learn.javascript.ru/default-browser-action" rel="nofollow">Действия браузера по умолчанию.</a> <br/> <pre><code class="javascript">document.querySelector("#butlog").addEventListener('click', (e) => {
e.preventDefault(); // <---
window.location.assign("https://vk.com/");
});</code></pre>