Используя HTML-коды, создайте блок div с текстом “Цвет изменяется кнопкой”. Добавьте кнопку, щелчок по которой окрашивает текст в синий цвет.
Программист часто использует в своей работе готовые скрипты, скачанные, например, из Интернета (citforum.ru/internet/javascript/exgraph.shtml — изменение картинки). Поэтому нужно уметь читать чужой код.
Задание 3
Проанализируйте приведённые ниже скрипты. Не копируя и не запуская их в браузере, ответьте на вопрос: что изменится при щелчке на кнопке?
Примеры скриптов
1.
| <p id="5">Здесь должен быть красный текст.</p> <input type="button" value="Щёлкни" onclick="document.getElementById('5').style.border = '#00FF00 ridge 5px'"/>
|
2.
| <p id="identifier">Какой-то текст.</p> <input type="button" value="Щёлкни" onclick="document.getElementById('identifier').style.fontSize = '36px'"/>
|
3.
| <p id="текст">Прыгающий текст</p> <input type="button" value="Щёлкни" onclick="document.getElementById('текст').style.paddingLeft = '100px'"/>
|
Здесь мы должны познакомиться с ещё одной особенностью JavaScript. Дело в том, что символ дефиса в именах переменных и свойств использовать нельзя. Поэтому составные CSS-свойства записываются следующим образом. Свойство пишется слитно без дефиса, но второе слово пишется с большой буквы. Пример назначения цвета рамки:
document.getElementById('имя').style.borderColor='red';