HTML tool query?

Discussion in 'HTML & Website Design' started by Weirfire, Apr 12, 2006.

  1. #1
    Does anyone know of a tool that breaks down your code into a tree structure so if I put in something like

    <html>
    <head>

    bla bla

    </head>
    <body>

    <table>
    <tr><td> bla bla bla bla</td></tr>
    <tr><td> bla bla nbla </td></tr>
    </table>

    </body>
    </html>

    It would return something like

    <table>
    <tr>
    <td></td>
    <td></td>
    </tr>
    </table>


    Cheers
     
    Weirfire, Apr 12, 2006 IP
  2. penagate

    penagate Guest

    Messages:
    277
    Likes Received:
    17
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Hi,

    It could be fairly easily made. What do you need it for?

    If you are after a detailed tree representation of the document structure then look no further than Firefox's DOM Inspector tool. It also highlights elements on the page as you select them from the DOM inspector.

    If on the other hand you simply want to strip out non-tag content you could do that fairly easily with one or two regular expressions, maybe on a PHP page.

    Say
    // Remove content data
    preg_replace('#<(.*)>(.+?)</(.*)>#s', '<$1></$3>', $code);
    
    // Remove attributes
    preg_replace('#<([ ]{0,})([^ ]{1,})(.*)>#'), '<$2>', $code);
    
    PHP:
    Untested, just a thought.

    - P
     
    penagate, Apr 12, 2006 IP
    Weirfire likes this.
  3. Weirfire

    Weirfire Language Translation Company

    Messages:
    6,979
    Likes Received:
    365
    Best Answers:
    0
    Trophy Points:
    280
    #3
    Thanks mate, that was really helpful!! :)
     
    Weirfire, Apr 13, 2006 IP
  4. marty

    marty Peon

    Messages:
    154
    Likes Received:
    7
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Hello I use homesite 4.5 (note: 4.5 is not the latest version) and homesite has a "Tag Inspector" tab that renders a tree view of the code. This isn't exactly what you asked about, but I thought you might find it interesting.

    I've attached a picture of it.
     

    Attached Files:

    marty, Apr 13, 2006 IP
  5. anjanesh

    anjanesh Well-Known Member

    Messages:
    344
    Likes Received:
    7
    Best Answers:
    0
    Trophy Points:
    165
    #5
    In FireFox goto Tools > DOM Inspector and you'll find the entire tree under HTML. Because the source is free you can get the complete tree structure for all tags from Mozilla source. But its in c++ I guess.
     
    anjanesh, Apr 13, 2006 IP