JavaScript метод document.createElement()

JavaScript Document

Определение и применение

JavaScript метод document.createElement() позволяет создать и вернуть новый элемент (пустой узел Element) с указанным именем тега.

Поддержка браузерами

МетодChrome
Chrome
Firefox
Firefox
Opera
Opera
Safari
Safari
Internet Explorer
IExplorer
Microsoft Edge
Edge
document.createElement()ДаДаДаДаДаДа

JavaScript синтаксис:

document.createElement( tagName )
document.createElement( tagName, options )

tagName - String
options - Object

Спецификация

Document Object Model (DOM) Level 1

Значения параметров

ПараметрОписание
tagNameСтроковое значение, указывающее на тип создаваемого элемента. Строка, указанная в параметре, преобразуется в нижний регистр. В Firefox, Opera и Chrome метод .createElement( null ) работает так же, как .createElement( "null" ).
optionsНеобязательный объект ElementCreationOptions, содержащий одно свойство с именем is, значение которого является именем тега для пользовательского элемента, ранее определенного с помощью метода customElements.define().

Пример использования

<!DOCTYPE html>
<html>
	<head>
		<title>Использование JavaScript метода document.createElement()</title>
	</head>
	<body>
		<button onclick = "myFunc()">Нажми меня</button> <!-- добавляем атрибут событий onclick -->
		<hr>
		<script>
	function myFunc() {
	  let  newElem = document.createElement( "button" ); // создаем новый элемент <button>
	  const text = document.createTextNode( "Mybutton" ); // создаем текстовое содержимое
	  newElem.appendChild( text ); // добавляем текстовое содержимое элементу <button>                     
	  document.body.appendChild( newElem );  // добавляем наш элемент в элемент <body>
	}
		</script>
	</body>
</html>

В этом примере с использованием атрибута событий onclick при нажатии на кнопку (HTML элемент <button>) вызываем функцию myFunc(), которая:

Результат нашего примера:

Пример использования JavaScript метода document.createElement()
Пример использования JavaScript метода document.createElement()
JavaScript Document