document.createTextNode

  • Revision slug: Web/API/document.createTextNode
  • Revision title: document.createTextNode
  • Revision id: 474195
  • Created:
  • Creator: kscarfone
  • Is current revision? No
  • Comment Updated tags

Revision Content

{{DomRef}}

Summary

Creates a new Text node.

Syntax

text = document.createTextNode(data);
  • text is a Text node.
  • data is a string containing the data to be put in the text node.

Example

<!DOCTYPE html>
<html lang="en">
<head>
<title>createTextNode example</title>
<script>
function addTextNode(text) {
  var newtext = document.createTextNode(text),
      p1 = document.getElementById("p1");

  p1.appendChild(newtext);
}
</script>
</head>

<body>
  <button onclick="addTextNode('YES! ');">YES!</button>
  <button onclick="addTextNode('NO! ');">NO!</button>
  <button onclick="addTextNode('WE CAN! ');">WE CAN!</button>

  <hr />

  <p id="p1">First line of paragraph.</p>
</body>
</html>

Specification

Revision Source

<div>
  {{DomRef}}</div>
<h2 id="Summary" name="Summary">Summary</h2>
<p>Creates a new Text node.</p>
<h2 id="Syntax" name="Syntax">Syntax</h2>
<pre class="syntaxbox">
<var>text</var> = document.createTextNode(<var>data</var>);
</pre>
<ul>
  <li><code>text</code> is a Text node.</li>
  <li><code>data</code> is a string containing the data to be put in the text node.</li>
</ul>
<h2 id="Example" name="Example">Example</h2>
<pre class="brush:js">
&lt;!DOCTYPE html&gt;
&lt;html lang="en"&gt;
&lt;head&gt;
&lt;title&gt;createTextNode example&lt;/title&gt;
&lt;script&gt;
function addTextNode(text) {
  var newtext = document.createTextNode(text),
      p1 = document.getElementById("p1");

  p1.appendChild(newtext);
}
&lt;/script&gt;
&lt;/head&gt;

&lt;body&gt;
  &lt;button onclick="addTextNode('YES! ');"&gt;YES!&lt;/button&gt;
  &lt;button onclick="addTextNode('NO! ');"&gt;NO!&lt;/button&gt;
  &lt;button onclick="addTextNode('WE CAN! ');"&gt;WE CAN!&lt;/button&gt;

  &lt;hr /&gt;

  &lt;p id="p1"&gt;First line of paragraph.&lt;/p&gt;
&lt;/body&gt;
&lt;/html&gt;
</pre>
<h2 id="Specification" name="Specification">Specification</h2>
<ul>
  <li><a href="http://www.w3.org/TR/2000/REC-DOM-Level-2-Core-20001113/core.html#ID-1975348127">createTextNode </a></li>
</ul>
Revert to this revision