Вместо этого вы можете использовать делегат слушателя:
document.addEventListener('click', e => {
if (e.target.matches('.book-now') {
// declare variables
// send Ajax request
// etc.
}
})
Если вы не хотите этого (или должны слушать событие, которое не будет пузыриться), ваш единственный вариант - проверить, является ли элемент существует:
let bookNowBtn = document.querySelector(".book-now");
if (bookNowBtn) {
bookNowBtn.addEventListener('click', e => { /*...*/ })
}
textarea, select, input, button { outline: none; }
Хотя утверждалось, что сохранение свечения / контура на самом деле полезно для доступности, поскольку это может помочь пользователям увидеть, какой элемент в данный момент находится в фокусе.
Вы также можете использовать псевдоэлемент ' : focus 'для таргетинга на входы только тогда, когда пользователь их выбрал.
Это решение работало на меня.
input:focus {
outline: none !important;
box-shadow: none !important;
}
При изменении размера текстового поля в браузерах на основе webkit:
Установка max-height и max-width для текстового поля не удаляет визуальный дескриптор изменения размера. Попробуйте:
resize: none;
(и да, я согласен с «старайтесь не делать ничего, что нарушает ожидания пользователя», но иногда это имеет смысл, например, в контексте веб-приложения)
Чтобы настроить внешний вид webkit формирует элементы с нуля:
-webkit-appearance: none;