Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    Senior Coder
    Join Date
    Jun 2002
    Location
    near Oswestry
    Posts
    4,508
    Thanks
    0
    Thanked 0 Times in 0 Posts

    How to remove comments from the DOM?

    I'm using Alex's whitespace cleaning method:
    Code:
    //clean whitespace method by Alex Vincent 
    var notspace = /\S/;
    function cleanWhitespace = function(node)
    {
    	for (var x=0; x<node.childNodes.length; x++) 
    	{
    		var child = node.childNodes[x];
    		//if it's a whitespace text node
    		if ((child.nodeType == 3) && (!notspace.test(child.nodeValue))) 
    		{
    			node.removeChild(node.childNodes[x]);
    			x--;
    		}
    		//elements can have text child nodes of their own
    		if(child.nodeType == 1) 
    		{
    			cleanWhitespace(child);
    		}
    	}
    }
    How can it be modified so that it removes comments as well?
    "Why bother with accessibility? ... Because deep down you know that the web is attractive to people who aren't exactly like you." - Joe Clark

  • #2
    Master Coder
    Join Date
    Feb 2003
    Location
    UmeŚ, Sweden
    Posts
    5,575
    Thanks
    0
    Thanked 83 Times in 74 Posts
    You could look for nodeType 8. I'd recommend you to use a switch statement instead of that if statement.
    Code:
    function fnCleanTree(node){
        var
            i=0,
            cNodes=node.childNodes,
            t;
        while((t=cNodes.item(i++)))
            switch(t.nodeType){
                case 1: // Element Node
                    fnCleanTree(t);
                    break;
                case 3: // Text Node
                    if(notspace.test(t.nodeValue))
                        break;
                case 8: // Comment Node (and Text Node without non-whitespace content)
                    node.removeChild(t);
                    i--;
            }
    }
    Last edited by liorean; 11-19-2003 at 02:39 AM.
    liorean <[lio@wg]>
    Articles: RegEx evolt wsabstract , Named Arguments
    Useful Threads: JavaScript Docs & Refs, FAQ - HTML & CSS Docs, FAQ - XML Doc & Refs
    Moz: JavaScript DOM Interfaces MSDN: JScript DHTML KDE: KJS KHTML Opera: Standards

  • #3
    Senior Coder
    Join Date
    Jun 2002
    Location
    near Oswestry
    Posts
    4,508
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Ta
    "Why bother with accessibility? ... Because deep down you know that the web is attractive to people who aren't exactly like you." - Joe Clark

  • #4
    Master Coder
    Join Date
    Feb 2003
    Location
    UmeŚ, Sweden
    Posts
    5,575
    Thanks
    0
    Thanked 83 Times in 74 Posts
    Oh, this will likely remove the doctype from documents if you're using iew, however. Does that matter in the case you're using it?
    liorean <[lio@wg]>
    Articles: RegEx evolt wsabstract , Named Arguments
    Useful Threads: JavaScript Docs & Refs, FAQ - HTML & CSS Docs, FAQ - XML Doc & Refs
    Moz: JavaScript DOM Interfaces MSDN: JScript DHTML KDE: KJS KHTML Opera: Standards

  • #5
    Senior Coder
    Join Date
    Jun 2002
    Location
    near Oswestry
    Posts
    4,508
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Yeah actually, it matters a great deal. I suppose I could examine the node text to see if it's a DOCTYPE before removing it (or not) .. unless you know a better way?
    "Why bother with accessibility? ... Because deep down you know that the web is attractive to people who aren't exactly like you." - Joe Clark

  • #6
    Master Coder
    Join Date
    Feb 2003
    Location
    UmeŚ, Sweden
    Posts
    5,575
    Thanks
    0
    Thanked 83 Times in 74 Posts
    Hmm, some thinking led me some testing. The html:
    Code:
    <?xml version="1.0" encoding="utf-8"?>
    <!-- Just a comment -->
    <!DOCTYPE html "-//W3C//DTD XHTML 1.1 Strict">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-gb">
    <head>
    <title>  Title  with  extra  spaces  in  it  </title>
    <script type="text/javascript" src="js.js"></script>
    </head>
    <body>
    <pre id="prenode"></pre>
    
    <!-- Just a puny little comment -->
    
    
    <p>                                            <span>  hello
    
    
                  </span>
    </p>
    
    
    </body>
    </html>
    and the script:
    Code:
    function fnCleanTree(node){
        var
            cNodes=node.childNodes,
            i=cNodes.length,
            t,
            reS = /\S/;
        while(i-- && (t=cNodes[&#0105;]))
            switch(t.nodeType){
                case 1: // Element Node
                    fnCleanTree(t);
                    break;
                case 3: // Text Node
                    if(reS.test(t.nodeValue))
                        break;
                case 8: // Comment Node (and Text Node without non-whitespace content)
                    node.removeChild(t);
                default:
                    i--;
            }
    }
    
    window.onload=function(){
        fnCleanTree(document.documentElement);
        var
            i=0,
            sDocument='',
            sT;
        while((sT=document.all[i++])!=document.documentElement)
            sDocument+=(sT.outerHTML || sT.text)+'\r\n';
        sDocument+=document.documentElement.outerHTML;
        document.getElementById('prenode').appendChild(document.createTextNode(sDocument));
    }
    And finally, the output (as written in the browser window):
    Code:
    <!DOCTYPE html "-//W3C//DTD XHTML 1.1 Strict">
    <HTML xml:lang="en-gb" xmlns="http://www.w3.org/1999/xhtml"><HEAD><TITLE>Title with extra spaces in it</TITLE>
    <SCRIPT src="js.js" type=text/javascript></SCRIPT>
    </HEAD>
    <BODY><PRE id=prenode></PRE>
    <P><SPAN>hello </SPAN></P></BODY></HTML>hello
    Which gave me the following results:
    - You can't iterate over the document itself (of course, since it's not the root node, but the container of it), it has to be a node like document.documentElement which has it's childNodes collection to iterate through, or a collection such as document.all.
    - You can't target comment nodes outside of the root node using the DOM. Which means you can't remove the doctype, either.
    - You can target nodes outside the root node with document.all, however.
    Last edited by liorean; 11-26-2003 at 04:19 PM.
    liorean <[lio@wg]>
    Articles: RegEx evolt wsabstract , Named Arguments
    Useful Threads: JavaScript Docs & Refs, FAQ - HTML & CSS Docs, FAQ - XML Doc & Refs
    Moz: JavaScript DOM Interfaces MSDN: JScript DHTML KDE: KJS KHTML Opera: Standards


  •  

    LinkBacks (?)


    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •