H
Howard Jess
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>
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>
