В этой статье описывается метод JavaScript для изменения фона и цвета шрифта веб -страницы. Поделитесь этим для вашей ссылки. Конкретный анализ заключается в следующем:
JavaScript, нажав кнопку, чтобы изменить цвет фона веб -страницы и шрифт. Есть n кнопок, чтобы изменить цвет на веб -странице. Нажав на разные кнопки, шрифт и фон веб -страницы изменятся на разные цвета. Очень простой апплет JavaScript.
1. Основные цели
Как только вы откроете веб -страницу, вы сначала подскажите сообщение о приветствии "Привет"
Существуют n кнопки, чтобы изменить цвет на веб -странице, где возврат - это цвет по умолчанию веб -страницы, фон белый, а шрифт черный.
Нажмите на разные кнопки, и шрифт и фон веб -страницы изменятся на разные цвета.
Первоначально я хотел сделать улучшение радуги, но принцип точно такой же, поэтому я не буду писать больше кнопок.
2. Основные идеи
Ключ состоит в том, чтобы предоставить идентификаторы для тегов тела и шрифтов JS, чтобы их можно было управлять в JS. Этот пример предоставляет приложение для функций JS.
3. Процесс производства
Просто простая маленькая страница, см. Комментарии для подробностей:
Скопируйте код следующим образом: <! Doctype html public "-// w3c // dtd xhtml 1.0 transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns = "http://www.w3.org/1999/xhtml">
<голова>
<meta http-equiv = "content-type" content = "text /html; charset = gb2312" />
<Title> JS изменить цвет фона </title>
<!-Этот абзац также может быть разделен на файл JS, но этот код слишком короткий, поэтому нет необходимости->
<script type = "text/javascript">
// Нагрузка эквивалентна конструктору этой веб -страницы, а нагрузка эквивалентна функции дизъюнкции этой веб -страницы
function Load () {
оповещение ("Привет!");
}
function unload () {
оповещение («До свидания!»);
}
функция ChangeColor (bcolor, fcolor) {
// эквивалентно изменению цвета шрифта для шрифта <span style = "color: прошедший fcolor">
document.getElementById ("body"). style.background = bcolor;
document.getElementbyId ("Ziti"). Style.color = fcolor;
}
</script>
</head>
<!-Ключ-предоставить идентификатор для всей веб-страницы и линейных шрифтов. Метод getElementbyId () в JS может легко контролировать вещи в CSS->
<body onload = "load ()" onUnload = "unwoding ()" id = "body">
<span id = "ziti"> js </span>
<br />
<!-Обратите внимание, что при прохождении параметров в двойных кавычках исходные двойные кавычки станут одинокими кавычками. Значение OnClick-это то, что будет запустить после нажатия этой кнопки->
<input onclick = "ChangeColor ('#ff0000', '#ffffff')" type = "Кнопка"
value = "red" />
<input onclick = "ChangeColor ('#ff9900', '#ffffff')" type = "Кнопка"
value = "Orange" />
<input onclick = "ChangeColor ('#ffff00', '#000000')" type = "Кнопка"
value = "желтый" />
...
<input onclick = "ChangeColor ('#ffffff', '#000000')" type = "Кнопка"
value = "return" />
</body>
</html>
Функция onunload () почти действительна только после того, как IE закрывает эту страницу, и это диалоговое окно не будет в передней части, и Google Chrome не оказывает эффекта. Следовательно, эта функция имеет мало значения.
Друзья, которые заинтересованы в цветных навыках JS, также могут ссылаться на онлайн -инструмент:
RGB Color Concoding Generator
Инструмент по сопоставлению веб -цвета онлайн
Сравнение цветовых запросов RGB table_color code table_colour Английские имена коллекция
Я надеюсь, что эта статья будет полезна для каждого программирования JavaScript.