Привет! Сегодня я хочу поделиться с вами своим опытом создания веб-страницы с использованием JavaScript. Конкретнее‚ я расскажу о том‚ как создать страницу с тремя кнопками‚ которые меняют изображение при нажатии.
Как вы можете видеть‚ я назначил изображению идентификатор ″image″ и установил ему исходное изображение ″default.jpg″. Также я добавил немного CSS для установки размеров изображения.Теперь перейдем к созданию JavaScript файла. Создайте новый файл с именем ″script.js″ и добавьте следующий код⁚
javascript
window.onload function {
var image document.getElementById(″image″);
var button1 document.getElementById(″button1″);
var button2 document.getElementById(″button2″);
var button3 document.getElementById(″button3″);
button1.onclick function {
image.src ″image1.jpg″;
};
button2.onclick function {
image.src ″image2.jpg″;
};
button3.onclick function {
image.src ″image3.jpg″;
};
};
В этом коде мы используем метод `getElementById` для получения ссылок на элементы нашей страницы. Затем мы назначаем обработчики событий `onclick` для каждой кнопки. Когда кнопка нажата‚ мы присваиваем свойству `src` изображения новое значение‚ соответствующее изображению‚ которое мы хотим отобразить.
Это все! Теперь каждый раз‚ когда вы нажимаете на одну из трех кнопок‚ изображение на странице будет меняться соответственно. Вы можете легко модифицировать этот код‚ добавляя больше кнопок и изображений по своему усмотрению.
Надеюсь‚ мой опыт создания такой веб-страницы с тремя кнопками и изменением изображения при нажатии пригодится вам. Успехов в вашем программировании на JavaScript!