const inputEl = document.querySelector('input')
const btnMinus = document.querySelector('.btn-minus')
const btnPlus = document.querySelector('.btn-plus')
const changeInputValue = num => {
const newValue = inputEl.value + num
inputEl.value = newValue
inputEl.setAttribute('value', newValue)
}
btnMinus.addEventListener('click', () => {
changeInputValue(-1)
})
btnPlus.addEventListener('click', () => {
changeInputValue(1)
})
const priceEl = document.querySelector('.price')
const resultEl = document.querySelector('.result');
const callback = mutationList => {
for (const mutation of mutationsList) {
if (mutation.attributeName === 'value') {
resultEl.textContent = priceEl.textContent * inputEl.value
}
}
};
const observer = new MutationObserver(callback);
observer.observe(inputEl, { attributes: true });
<img src="./picture.png" alt="picture">
<img src="picture.png" alt="picture">
const player = {
x: 0,
y: 0,
speed: 3
};
const target = {
x: 100,
y: 300
};
// Ваша функция для обновления
const update = () => {
const angle = Math.atan2(target.y - player.y, target.x - player.x);
const distance = Math.hypot(target.x - player.x, target.y - player.y);
if (distance > player.speed) {
player.x += Math.cos(angle) * player.speed;
player.y += Math.sin(angle) * player.speed;
} else {
player.x += Math.cos(angle) * distance;
player.y += Math.sin(angle) * distance;
}
requestAnimationFrame(update);
};
update();
const players = {
player1: {
attack: 5,
defense: 3,
speed: 5,
control: 5,
strike: 5,
stateOnSat: false
},
player2: {
attack: 3,
defense: 5,
speed: 4,
control: 4,
strike: 5,
stateOnSat: false
}
}
const btnPlus = document.querySelectorAll('.btn-plus')
btnPlus[0].onclick = () => {
players.player1.stateOnSat = true
alert(players.player1.stateOnSat) // true
}
// Или
btnPlus[1].addEventListener('click', () => {
players.player2.stateOnSat = true
})
<button class="fas fa-plus-square btn btn-plus" onclick="players.player2.stateOnSat = true">Plus</button>
<meta name="viewport" content="width=device-width, initial-scale=1">
@media only screen and (min-width: 480px) {
#___gcse_0 input[type="text"] {
padding: 7px !important;
}
}