"Live" DOM NodeList: rationale?

Discussion in 'Javascript' started by Howard Jess, Jul 22, 2004.

  1. Howard Jess

    Howard Jess Guest

    Given the html at the end of this message, I see how
    a DOM NodeList exhibits its "live" behavior; that is,
    adding elements to a document can change any NodeList
    variables, when there's *no* code that refers to them.

    I suppose I can imagine cases where this idea would be
    useful, but I can imagine many more where I'd like to
    get a *static* list of, e.g., the <p> elements in my
    document, and do something with them, regardless of any
    I might add while I'm working on the list.

    Can anyone explain the rationale behind this decision?

    hj

    ---
    Sample code exhibiting this behavior:



    <html><head><title>Live Collection Demo</title></head><body>
    <h1>Live Collection Demo</h1>
    <script type="text/javascript">
    function dumplist(plist) {
    var s = plist.length + ' elements:\r\n ';
    for (var i=0; i<plist.length; i++)
    s += "plist[" + i + "] id='" + plist.getAttribute('id') + "'\r\n ";
    return s;
    }
    function add_para() {
    var plist,newp,lastp,desc,description;

    plist = document.getElementsByTagName('p');
    lastp = document.getElementById('last');
    description = ' Initially: ' + dumplist(plist);
    newp = document.createElement('p');
    newp.appendChild(document.createTextNode('A middle paragraph.'));
    newp.setAttribute('id','middle');
    lastp.parentNode.insertBefore(newp,lastp);
    description += '\r\n After adding: ' + dumplist(plist);
    description += '\r\n\r\n The element referenced at plist[1] changed ' +
    'with no reference to plist. It\'s "live".'
    desc = document.createElement('pre');
    desc.style.whitespace = 'pre';
    desc.appendChild(document.createTextNode(description));
    document.body.appendChild(desc);
    }
    </script>
    <p id="first">There are initially two paragraphs in this document.
    This one's id is "first".
    </p><p id="last">This paragraph's id is "last".</p>
    <form action="" onsubmit="return false">
    <button onclick="add_para()">Add a paragraph</button>
    </form></body></html>
     
    Howard Jess, Jul 22, 2004
    #1
    1. Advertising

  2. Howard Jess

    Grant Wagner Guest

    Howard Jess wrote:

    > Given the html at the end of this message, I see how
    > a DOM NodeList exhibits its "live" behavior; that is,
    > adding elements to a document can change any NodeList
    > variables, when there's *no* code that refers to them.
    >
    > I suppose I can imagine cases where this idea would be
    > useful, but I can imagine many more where I'd like to
    > get a *static* list of, e.g., the <p> elements in my
    > document, and do something with them, regardless of any
    > I might add while I'm working on the list.
    >
    > Can anyone explain the rationale behind this decision?
    >
    > hj


    I'd guess the rationale is that they didn't want to create two node types to
    represent "real" nodes and those that were added programmatically. Ultimately,
    there is no difference between them, so there is no need to treat them differently.

    It's not hard to keep track of nodes you insert programmatically anyway. When you
    add elements to the DOM programmatically, set the ID to something like "jsMyId".
    Then you can do:

    var paragraphs = document.getElementsByTagName("p");
    if (p) {
    for (var i = 0; i < p.length; i++) {
    if (p.id.indexOf("js") != 1) {
    // it was part of the downloaded HTML
    } else {
    // it was added by JavaScript
    }
    }
    }

    --
    Grant Wagner <>
    comp.lang.javascript FAQ - http://jibbering.com/faq
     
    Grant Wagner, Jul 22, 2004
    #2
    1. Advertising

  3. Howard Jess <> writes:

    > I suppose I can imagine cases where this idea would be
    > useful, but I can imagine many more where I'd like to
    > get a *static* list of, e.g., the <p> elements in my
    > document, and do something with them, regardless of any
    > I might add while I'm working on the list.


    It's easier to go from a dynamic list to a static than
    the other way :)
    ---
    function arrayOfNodeList(nodeList) {
    return Array.prototype.slice.call(nodeList, 0, nodeList.length);
    }
    ---
    which oddly enough doesn't work in Opera (well, there's host objects
    involved, so all bet's are off). Or the longer:
    ---
    function arrayOfNodeList(nodeList) {
    var arr = new Array();
    for (var i=0; i<nodeList.length;i++) {
    arr = nodeList;
    }
    return arr;
    }
    ---

    > Can anyone explain the rationale behind this decision?


    Only the ones who made it. But my guess is the above.

    /L
    --
    Lasse Reichstein Nielsen -
    DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
    'Faith without judgement merely degrades the spirit divine.'
     
    Lasse Reichstein Nielsen, Jul 22, 2004
    #3
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Cuperman

    NodeList iteration and node edit

    Cuperman, Jan 24, 2006, in forum: ASP .Net
    Replies:
    1
    Views:
    847
  2. Erwan
    Replies:
    0
    Views:
    640
    Erwan
    Oct 20, 2004
  3. Michael Preminger

    org.w3c.dom.NodeList - empty nodes?

    Michael Preminger, Apr 10, 2005, in forum: Java
    Replies:
    2
    Views:
    1,569
    John C. Bollinger
    Apr 11, 2005
  4. Angus McIntyre
    Replies:
    2
    Views:
    598
    Angus McIntyre
    Sep 4, 2003
  5. tommalia
    Replies:
    0
    Views:
    505
    tommalia
    Jul 18, 2006
Loading...

Share This Page