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.
Page 1 of 2 12 LastLast
Results 1 to 15 of 16

Thread: What's a node?

  1. #1
    Senior Coder
    Join Date
    Apr 2003
    Location
    Canada
    Posts
    1,063
    Thanks
    2
    Thanked 0 Times in 0 Posts

    What's a node?

    Hello, I would like to know what a node is. At first, I thought it was a tag, but then I saw it wasn't.
    Could anyone explain what exactly a node is to me?

    Thanks

    btw, if this thread should go elswhere, feel free to move it
    Shawn

  • #2
    Regular Coder
    Join Date
    Apr 2003
    Location
    Atlanta, GA
    Posts
    487
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Basically any part of the HT/X/?ML document is a node. There are at least 12 kinds of nodes, basically only 3 of which you need to worry about regularly (green), and 2 others which are handy to know(blue). The rest are important when you're doing really intensive XML processing for data sharing, etc.

    ELEMENT_NODE - any element in the document, whether <h1> or <style>
    ATTRIBUTE_NODE - any attribute of any element, created in the ML of the document itself (script properties don't count as attribute nodes)
    TEXT_NODE - any text in the document that lives outside attribute nodes. <input type="submit" value="Go!"> : not a text node. <button>Go!</button> : text node.
    DOCUMENT_NODE - any whole document, including those contained in each frame.
    DOCUMENT_FRAGMENT_NODE - any collection of the rest of the types of nodes except for the DOCUMENT_NODE type
    CDATA_SECTION_NODE - a node explicitly created to be ignored by any XML processing, wrapped in a CDATA comment: <![CDATA[ comments here ]]>
    ENTITY_REFERENCE_NODE - more popular in DTDs and in future levels of the DOM, this is essentially a variable that refers to something else. Read the HTML specification to see entity references in action.
    ENTITY_NODE - what's refered to by entity reference nodes. I'm not even sure how this can exist in XML just yet.
    PROCESSING_INSTRUCTION_NODE - this is how to tell an XML parser to do something (obey constraints, perform a calculation) - though I'm not sure how it's defined.
    COMMENT_NODE - any comment not using CDATA wrappers.
    DOCUMENT_TYPE_NODE - the part of the document specifying the DTD or schema location
    NOTATION_NODE - umm... I'm kind of at a loss here.

    I know that's not a fantastic list, but you shouldn't have to worry too much about the types of nodes. A node is a piece of a document, and all nodes share the Node interface. If you don't have Javascript: the Definitive Guide, go pick it up and it'll tell you pretty much everything you need to know about nodes.

    Oh, and everybody please feel free to correct anything that's wrong in that list.

  • #3
    Senior Coder
    Join Date
    Apr 2003
    Location
    Canada
    Posts
    1,063
    Thanks
    2
    Thanked 0 Times in 0 Posts
    so:
    <html> (node)
    <body bgcolor="red" (node)>(node)
    <h1>(node)
    text (node)
    </h1>
    </body>
    </html>
    .
    What javascript would return this:
    html, body, bgcolor="red", h1, text
    ?
    Shawn

  • #4
    Senior Coder
    Join Date
    Feb 2004
    Posts
    1,206
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Code:
    <html>
     <body bgcolor="red">
      <h1>
       text
      </h1>
     </body>
    </html>
    Ok so there a few terms you need to know:
    -Node
    -Element
    -TextNode
    -Attribute
    -ChildNode

    All of these things beneath Node are Nodes. Think of Node as a parent, and the rest Node's children -- so they inherit characteristics from Node, and then add new characteristics to become different.

    Basically all HTML tags are Elements. So all the Elements in that above code snippet is: html, body, and h1.

    h1 is a ChildNode of body, and text is a ChildNode of h1. text is a TextNode.

    bgcolor is an Attribute of the body Element, and "red" is the value of the bgcolor Attribute.

    I think that's correct. I don't know how familiar you are with APIs or if you even know how to read one, but this is a good one that I use and it might help you figure out these things better:
    http://krook.org/jsdom/Node.html

    Hope that helps,
    Sadiq.

  • #5
    Senior Coder
    Join Date
    Apr 2003
    Location
    Canada
    Posts
    1,063
    Thanks
    2
    Thanked 0 Times in 0 Posts
    so:
    Code:
    <html>
    <head>
    <script type="text/javascript">
    
    function getem(){
    
    var i,str="",nodes=document.nodes;
    for(i=0;i<nodes.length;++i){
     str+=nodes[i].nodeName+", ";
    }
    alert(str);
    }
    
    document.onload=getem;
    </script>
    <body>
    <h1>text</h1>
    </body>
    </html>
    How could I do something like this?
    Shawn

  • #6
    Senior Coder
    Join Date
    Feb 2004
    Posts
    1,206
    Thanks
    0
    Thanked 0 Times in 0 Posts
    It's not quite as easy as that. What we're talking about here is DOM (Document Object Model). This model (the M) basically says that this file is a document (the D). This document has objects, arranged in a tree format (the O).

    So we've got a tree. This code (or document):
    Code:
    <html>
     <body bgcolor="red">
      <h1>
       text
      </h1>
     </body>
    </html>
    Produces the following tree (or object model):
    Code:
    document
         |
       html
         |  
       body
         |
        h1
         |
       text
    So document is at the top.

    If you do document.childNodes, you'll get a NodeList consisting of one Node: html.

    If you do document.firstChild.childNodes, you'll get a NodeList consisting of one Node: body

    If you do document.firstChild.firstChild.childNodes (or document.body.childNodes), you'll get a NodeList consisting of one Node: h1.

    I think you see my point. So it's not as easy as saying document.nodes and expect to get ALL the nodes in the DOM -- you have to "walk" the tree.

    You should really look at that API I posted. It tells you all the methods you're allowed to use. If you want to use a method, but it's not in the API, then you have to make that method up on your own (or find it from somewhere..).

    Hope that helps,
    Sadiq.

  • #7
    Senior Coder
    Join Date
    Apr 2003
    Location
    Canada
    Posts
    1,063
    Thanks
    2
    Thanked 0 Times in 0 Posts
    ok, still one problem though

    document.body.childNodes.length gives me 2 when I have this:
    <body><p>text</p></body>.
    it takes the p and the text, so the tree would be like this:
    body
    |
    P & #text

    what's going on here?
    Shawn

  • #8
    Senior Coder
    Join Date
    Feb 2004
    Posts
    1,206
    Thanks
    0
    Thanked 0 Times in 0 Posts
    That #text is not your text. Chances are that it's a space or something. You gotta be careful when walking the tree!

    Try alerting nodeValue on it and see if you get nothing..

    Sadiq.

  • #9
    Senior Coder
    Join Date
    Apr 2003
    Location
    Canada
    Posts
    1,063
    Thanks
    2
    Thanked 0 Times in 0 Posts
    nope, it IS the text...
    Shawn

  • #10
    Senior Coder
    Join Date
    Apr 2003
    Location
    Canada
    Posts
    1,063
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Try it yourself:
    Code:
    <html>
    <head>
    <script type="text/javascript">
    <!--
    
    window.onload=wtf;
    
    function wtf(){
    alert(document.body.childNodes.length);
    }
    
    //-->
    </script>
    </head>
    <body><p>Content Here</p></body>
    </html>
    Shawn

  • #11
    Senior Coder
    Join Date
    Feb 2004
    Posts
    1,206
    Thanks
    0
    Thanked 0 Times in 0 Posts
    What browser are you using?

    I used IE6 and Netscap 7.1 and both alerted 1, not 2 like you said...

    Sadiq.

  • #12
    Regular Coder
    Join Date
    Mar 2003
    Posts
    241
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Interesting, I tested in Moz 1.6 and IE 6, both alert 1. But Opera alerts 2

  • #13
    Senior Coder
    Join Date
    Apr 2003
    Location
    Canada
    Posts
    1,063
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Firebird here..
    Shawn

  • #14
    Senior Coder
    Join Date
    Apr 2003
    Location
    Canada
    Posts
    1,063
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Just tested with IE 5.5
    It alerts 1!!!
    Since when does IE do stuff better than firebird?
    Shawn

  • #15
    Senior Coder
    Join Date
    Feb 2004
    Posts
    1,206
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I have no idea.. do you have the latest version all that? I've never heard of firebird -- you sure you don't mean firefox?

    Maybe you can go to their website and post it on their bugs list, if they've got one.

    Sadiq.


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

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