JavaScript метод document.createTextNode()

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

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

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

Метод	Chrome	Firefox	Opera	Safari	IExplorer	Edge
`document.createTextNode()`	Да	Да	Да	Да	Да	Да

JavaScript синтаксис:

document.createTextNode( text )

text - String

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

Document Object Model (DOM) Level 1

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

Параметр	Описание
text	Строка, содержащая данные, которые будут помещены в текстовый узел. Обязательный параметр.

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

<!DOCTYPE html>
<html>
	<head>
		<title>Использование JavaScript метода document.createTextNode()</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 метода .createElement() объекта document создаем новый элемент <button>.
с использованием JavaScript метода .createTextNode() объекта document создаем текстовое содержимое.
с использованием JavaScript метода .appendChild() объекта Element добавляем текстовое содержимое элементу <button>, а затем добавляем наш созданный элемент в элемент <body>.

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

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

JavaScript Document