Javascript document body bgcolor

HTML DOM — Изменение HTML Элементов

HTML элементы можно изменять, используя JavaScript, HTML DOM и события.

Изменить HTML Элемент

HTML DOM и JavaScript могут изменять внутреннее содержимое и атрибуты HTML элементов.

Следующий пример изменяет цвет фона элемента :

Пример

Изменить Текст HTML Элемента — innerHTML

Простейший способ получить и модифицировать содержимое элемента — использование свойства innerHTML.

Следующий пример изменяет текст элемента

:

Пример

Изменить HTML Элемент Используя События

Обработчик события позволяет вам выполнить код, когда происходит событие.

События генерируются браузером, когда пользователь кликает на элементе, загружается страница, данные с формы отправляются на обработку и т.д.

Вы можете прочитать больше о событиях в следующем уроке.

Следующий пример изменяет цвет фона элемента при нажатии кнопки:

Пример

Изменить Текст Элемента — с помощью Функции

Следующий пример использует функцию для изменения текста элемента

при нажатии кнопки:

Пример

Использование Объекта Стиля (style)

Объект style (стиль) каждого HTML элемента представляет его индивидуальный стиль.

Следующий пример использует функцию для изменения стиля элемента при нажатии кнопки:

Пример

Изменить шрифт и цвет Элемента

Следующий пример использует функцию для изменения стиля элемента

при нажатии кнопки:

Источник

Style backgroundColor Property

The backgroundColor property sets or returns the background color of an element.

See Also:

Syntax

Return the backgroundColor property:

Set the backgroundColor property:

Property Values

Value	Description
color	Specifies the background color. Look at CSS Color Values for a complete list of possible color values
transparent	Default. The background color is transparent (underlying content will shine through)
initial	Sets this property to its default value. Read about initial
inherit	Inherits this property from its parent element. Read about inherit

Technical Details

Default Value:	transparent
Return Value:	A String, representing the background color
CSS Version	CSS1

Browser Support

backgroundColor is a CSS1 (1996) feature.

It is fully supported in all browsers:

Chrome	Edge	Firefox	Safari	Opera	IE
Yes	Yes	Yes	Yes	Yes	Yes

More Examples

Example

Set a background color of a specific element:

Example

Return the background color of a specific element:

Example

Return the background color of a document:

COLOR PICKER

Report Error

If you want to report an error, or if you want to make a suggestion, do not hesitate to send us an e-mail:

Thank You For Helping Us!

Your message has been sent to W3Schools.

Top Tutorials

Top References

Top Examples

Get Certified

W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy.

Источник

bgColor property (document)

Deprecated , it is no longer recommended to use. You can set the background color for the document with the backgroundColor style property of the body element. See Example 2 for details.

Syntax:

Possible values:

A legal color value. It can be a hexadecimal, RGB or predefined color value. For more information, see the page for colors.

Example HTML code 1:

head> script type="text/javascript"> function ChangeBg ()  document.bgColor = "cyan"; > script> head> body> button onclick="ChangeBg();">Change bgColorbutton> body>

Example HTML code 2:

head> style> body  background-color:#FF0000; > style> script type="text/javascript"> function ChangeBg ()  document.body.style.backgroundColor = "#00FF00"; > script> head> body> button onclick="ChangeBg();">Change backgroundColorbutton> body>

Источник

JavaScript: change a webpage background color

When you want to change a webpage background color using JavaScript, you need to manipulate the document object model (DOM) property by calling it inside your tag.

The property you need to manipulate for changing the background color of the whole page is document.body.style.background :

You can test the code out by changing the color of Google’s homepage. First, open your browser’s developer console. Then in the Console tab next to Elements, write the following code:

The color of Google’s homepage will change to Orange, just like in the screenshot below:

Back when I first learned how to code, I used to do this to impress my non-coder friends. But inside your project, you probably want to trigger the color change when the visitors do something. For example, you can change the background color when a is clicked:

If you want to wait until the page and the resources are fully loaded, you can listen for the load event instead.

Changing background color of a specific element

The document.body code means you are selecting the tag of your HTML page. You can also change only a part of your page by selecting only that specific element.

• getElementById() — get a single element with matching id attribute
• getElementsByClassName() — get elements with matching class attribute
• getElementsByName() — get elements with matching name attribute
• getElementsByTagName() — get elements with matching tag name like «li» for
• , «body» for

But the most recommended approach is to use getElementById() because it’s the most specific of these methods. Out of the four methods, only getElementById() will retrieve a single element.

The following example shows how you can change the background of element with id=»user» attribute:

 And that’s how you change the background color of a webpage with JavaScript.

Learn JavaScript for Beginners 🔥

Get the JS Basics Handbook, understand how JavaScript works and be a confident software developer.

A practical and fun way to learn JavaScript and build an application using Node.js.

About

Hello! This website is dedicated to help you learn tech and data science skills with its step-by-step, beginner-friendly tutorials.
Learn statistics, JavaScript and other programming languages using clear examples written for people.

Search

Type the keyword below and hit enter

Tags

Click to see all tutorials tagged with:

Источник

Метод back

Этот метод выполняет то же самое, какое выполняет следующее выражениее history.go (-1) .

Примеры

Смотрите также

Свойство bgColor

Строка, определяющая фоновый цвет документа.

Синтаксис

Свойство

Описание

Свойство bgColor выражается как шестнадцатеричный триплет RGB или так как это один из строковых литералов, внесенных в раздел Цвета JavaScript. Это свойство — JavaScript отражение атрибута BGCOLOR тега HTML .

Вы можете регулировать свойство bgColor в любое время.

Если вы выражаете цвет, как шестнадцатеричный триплет RGB, то вы должны использовать формат rrggbb. Например, шестнадцатеричное значения RGB для цвета salmon — red=FA, green=80, и blue=72, следователь триплет RGB для salmon — «FA8072».

Примеры

Следующий пример устанавливает фон документа в цвет aqua при использование строкового литерала:

Следующий пример устанавливает фон документа в aqua при использование шестнадцатеричного триплета:

Следующий пример позволяет пользователю устанавливать свой собственный цвет фона с помощью переключателей. function newColor(colorString) < document.bgColor=colorString >.

Смотрите также

Метод big

Показывает строку более крупным шрифтом. Этот метод идентичен тегу HTML <BIG>.

Синтаксис

Метод

Описание

Используйте метод big с методами write или writeln.

Примеры

var worldString = " Привет мир " Document.write (worldString.small ()) document.write (" ; " + worldString.big ()) document.write (" ; " + worldString.fontsize (7))

Следующий пример приводит к аналогичному результату: Привет, мир

Смотрите также

Метод blink

Формотирует строку в виде мигающей, как будто это было в &ltBLINK > отметка.

Синтаксис

StringName — любая строка или свойство существующего объекта.

Метод

Описание

Используйте метода blink с методами write или writeln для форматирования строки в документе. Использование метода blink идентично изменению вида выводимого текста с помощью тега HTML .

Примеры

var worldString = " Привет, мир " Document.write (worldString.blink ()) document.write (" ; " + worldString.bold ()) document.write (" ; " + worldString.italics ()) document.write (" ; " + worldString.strike ())

Следующий пример приведет к аналогичному результату: Привет, мир

Смотрите также

Метод blur

Удаляет фокус из указанного элемента формы.

Синтаксис

1. PasswordName.blur () 2. SelectName.blur () 3. TextName.blur () 4. TextareaName.blur ()

PasswordName является либо значением атрибута NAME объекта password либо значением элемента в массиве elements .
SelectName является либо значением атрибута NAME выбранного объекта либо значением элемента в массиве elements .
TextName является либо значением атрибута NAME текстового объекта либо значением элемента в массиве elements .
TextareaName является либо значением атрибута NAME объекта textarea либо значением элемента в массиве elements .

Метод

Описание

Использование метода blur удалять фокус из определенного элемента формы.

Примеры

Следующий пример удаляет фокус из элемента password userPass :

Если элемент password определен как: Или другой пример следующая строка удаляет фокус из элемента feedback:

Смотрите также

Метод bold

Показывает строку жирным шрифтом, аналогично тегу HTML <B>.

Синтаксис

StringName — любой ряд или собственность существующего объекта(цели).

Метод

Описание

Используйте метод bold с методами write или writeln, чтобы форматировать строку в документе.

Примеры

Следующий пример использует метод string, чтобы изменить строку: var worldString = » Привет мир » Document.write (worldString.blink ()) document.write («

Или в синтакси HTML: Привет мир

Смотрите также

Объект button

Синтаксис

NAME = «buttonName» определяет имя объекта кнопки. Вы можете обращаться к этому значению, используя свойство имени.
VALUE = «buttonText» определяет значение кнопки на экране. Вы можете обращаться к этому значению, используя свойство значения.

Использование свойства объекта и методы button:

1. ButtonName.propertyName 2. ButtonName.methodName (parameters) 3. FormName.elements [index] .propertyName 4. formName.elements[index].methodName(parameters) 

ButtonName — значение атрибута NAME объекта кнопки.
FormName является либо значением атрибута NAME объекта формы либо значением элемента в массиве form .
index — целое число, представляющее объект кнопки в форме.
PropertyName — один из свойств, описанных ниже.
MethodName — один из методов, описанных ниже.

Свойства

Описание

Объект button в форме выглядит следующим образом:

Объект button — элемент формы и должен быть определен внутри тега <FORM>.

Объект button — кнопка, которую вы можете использовать, для выполнения каких — либо действий, которое вы определили. При назначении кнопке обработчика событий onClick эта кнопка становится дополнительным средством для инициализации событий, отличных от submit и reset.

Связанные элементы

Свойства

Методы

Обработчики событий

Примеры

Следующий пример создает кнопку calcButton .На экране, которой написано «Calculate». Когда кнопка нажата вызывается функция calcFunction () .

Смотрите также

Знаете ли Вы, что, когда некоторые исследователи, пытающиеся примирить релятивизм и эфирную физику, говорят, например, о том, что космос состоит на 70% из «физического вакуума», а на 30% — из вещества и поля, то они впадают в фундаментальное логическое противоречие. Это противоречие заключается в следующем.

Вещество и поле не есть что-то отдельное от эфира, также как и человеческое тело не есть что-то отдельное от атомов и молекул его составляющих. Оно и есть эти атомы и молекулы, собранные в определенном порядке. Также и вещество не есть что-то отдельное от элементарных частиц, а оно состоит из них как базовой материи. Также и элементарные частицы состоят из частиц эфира как базовой материи нижнего уровня. Таким образом, всё, что есть во вселенной — это есть эфир. Эфира 100%. Из него состоят элементарные частицы, а из них всё остальное. Подробнее читайте в FAQ по эфирной физике.

Источник