In order to access this site you need to enable JavaScript!

You are here: Reference > JavaScript > client-side > HTML DOM > properties > isElementContentWhitespace (TextNode)

isElementContentWhitespace property (TextNode)

Browser support:

Returns a Boolean value that indicates whether the current TextNode only contains whitespaces.

Whitespace characters are: space, tab, new line characters (carriage-return, linefeed), vertical tab and form feed.

Syntax:

object.isElementContentWhitespace;

You can find the related objects in the Supported by objects section below.

This property is read-only.

Possible values:

Boolean, one of the following values:

false

TextNode not only contains whitespace characters.

true

TextNode only contains whitespace characters.

Default: this property has no default value.

Example HTML code 1:

This example illustrates the use of the isElementContentWhitespace property:

<head>
    <script type="text/javascript">
        
        function TestTextNodes () {
            var container = document.getElementById ("container");
            for (var i=0; i < container.childNodes.length; i++) {
                var child = container.childNodes[i];
                if (child.nodeType == 3 /*Node.TEXT_NODE*/) {
                    alert ("The " + (i+1) + ". child of the container is a text node.");
                    if (ContainsOnlyWS (child)) {
                        alert ("The text node only contains whitespaces.");
                    }
                    else {
                        alert ("The text node not only contains whitespaces.");
                    }
                }
                else {
                    alert ("The " + (i+1) + ". child of the container is a " + child.nodeName + ".");
                }
            }
        }

        function ContainsOnlyWS (textNode) {
            if ('isElementContentWhitespace' in textNode) {
                return textNode.isElementContentWhitespace;
            }

            var re = /^\s*$/;
            return (re.test (textNode.data));
        }
    </script>
</head>
<body>
    <div id="container">
        Some text in the container.
        <button>A button in the container</button>
    </div>
    <br /><br />
    <button onclick="TestTextNodes ();">Test text nodes</button>
</body>

Copy Code

Preview

Syntax Highlighter

Did you find this example helpful? yes no

Example HTML code 2:

This example is similar to the previous one, but it creates text nodes dinamically:

<head>
    <script type="text/javascript">
        function GenAndTest () {
            var textNode = document.createTextNode ("");
            alert ("Testing an empty text node.");
            TestWS (textNode);
            var textNode = document.createTextNode ("  ");
            alert ("Testing a text node that only contains spaces.");
            TestWS (textNode);
            var textNode = document.createTextNode ("not only whitespaces");
            alert ("Testing a text node that contains latin characters.");
            TestWS (textNode);
        }


        function TestWS (textNode) {            
            if ('isElementContentWhitespace' in textNode) {
                var onlyWS = textNode.isElementContentWhitespace;
            }
            else {
                var re = /^\s*$/;
                var onlyWS = re.test (textNode.data);
            }

            if (onlyWS) {
                alert ("The text node only contains whitespaces.");
            }
            else {
                alert ("The text node not only contains whitespaces.");
            }

        }
    </script>
</head>
<body>
    <button onclick="GenAndTest ();">Generate and test text nodes</button>
</body>