JavaScript Document createComment() Method

Beginner
5 min read
Updated: Nov 2026
3 examples
Method
Decorative image with the word CREATECOMMENT

Definition

document.createComment(data) creates a new Comment node containing a string and returns it. In markup it looks like <!-- … -->. Comments are for developers — they do not show on the rendered page.

Pass the required arguments shown below. Check return values and browser support before you rely on the result.

Syntax

Call document.createComment. Start with this line.

JavaScript
document.createComment(data)
CallWhat it does
document.createComment(data)Primary signature.
document.createComment(...)Call with the arguments your case needs.

Built into the browser. Call createComment(...) on document — no import required.

Library declarations
JavaScript
document.createComment(data)

Parameters

ParameterDescription
dataRequired. String content of the comment

Return Value

Return ValueDescription
*A Comment node (not yet in the tree)

JavaScript Examples

Example 1 — Create Comment and Serialize XML

Parse a tiny XML document, append a comment, then serialize it (MDN-style).

JavaScript
const doc = new DOMParser().parseFromString("<xml></xml>", "application/xml");
const comment = doc.createComment(
  "This is a not-so-secret comment in your document"
);
doc.querySelector("xml").appendChild(comment);

console.log(new XMLSerializer().serializeToString(doc));
// <xml><!--This is a not-so-secret comment in your document--></xml>
Try It Yourself

How It Works

  1. Parse XML. application/xml builds a real XML document.
  2. Create comment. createComment(data) returns a detached Comment.
  3. Append. The node must be attached before serialization shows it.
  4. Serialize. XMLSerializer prints the classic <!--…--> wrapper.

Example 2 — Append a Comment in HTML

Unlike CDATA, comments work on the live HTML document.

JavaScript
const box = document.createElement("div");
const note = document.createComment("TODO: polish styles");
box.appendChild(note);

console.log(box.childNodes.length); // 1
console.log(box.firstChild.nodeType); // 8
console.log(JSON.stringify(box.textContent)); // ""
Try It Yourself

How It Works

  1. Create a host. A plain div will hold the comment.
  2. Create the comment. Works on HTML — no NotSupportedError.
  3. Append. It becomes a child in childNodes.
  4. Check visibility. textContent stays empty; nothing paints on screen.

Example 3 — Inspect Comment Properties

Confirm nodeType, nodeName, and the stored string.

JavaScript
const c = document.createComment("hello");

console.log(c.nodeType); // 8
console.log(c.nodeName); // "#comment"
console.log(c.data); // "hello"
console.log(c.nodeValue); // "hello"
Try It Yourself

How It Works

  1. Create. One string argument becomes the comment body.
  2. Type check. COMMENT_NODE is always 8.
  3. Name. Comment nodes report "#comment".
  4. Read data. data and nodeValue both hold the same text.
Compatibility

Browser Support

Document.createComment() is a browser DOM API marked Baseline Widely available on MDN (since July 2015).

✓ Baseline Widely available

Document.createComment()

Supported in Chrome, Firefox, Safari, Edge, Opera, and Internet Explorer. Works on both HTML and XML documents.

Baseline Widely available
Google Chrome All modern versions
Yes
Microsoft Edge All modern versions
Yes
Mozilla Firefox All modern versions
Yes
Apple Safari All modern versions
Yes
Opera All modern versions
Yes
Internet Explorer IE 6+
Yes
createComment() Excellent in browsers

Bottom line: Safe to use in modern and legacy browsers. See the MDN createComment() reference.

Frequently Asked Questions

It creates a new comment node containing the given string and returns it. When serialized, the comment appears as <!--…--> in HTML or XML.
No. MDN marks Document.createComment() as Baseline Widely available (since July 2015). It is not Deprecated, Experimental, or Non-standard.
No. Comments do not render in the UI. They appear in View Source, DevTools, and serialized markup — useful for developer notes, not end users.
Yes. Unlike createCDATASection(), createComment() works on the live HTML document and on XML documents from DOMParser.
Create it with createComment(data), then attach it with appendChild, append, or insertBefore. Until then it has no parent.
Node.COMMENT_NODE, which is 8. nodeName is "#comment". Read the text with data, nodeValue, or textContent.

Next: createDocumentFragment()

Learn how to build offline DOM trees with document.createDocumentFragment().

createDocumentFragment() tutorial →

About the author

Mari Selvan M P
Mari Selvan M P 🔗

Developer, cloud engineer, and technical writer

  • Experience 12 years building web and cloud systems
  • Focus Full Stack Development, AWS, and Developer Education

I write practical tutorials so students and working developers can learn by doing—from databases and APIs to deployment on AWS.

AWS Certified Developer – Associate (Credly)

11 people found this page helpful

JavaScript Document createCDATASection() Method JavaScript Document createDocumentFragment() Method