I have a page with most of the content generated from an XML file. The generated content is a table with the first cell in each row being an expanding element:
<details><summary>...</summary>...</details>
I’m trying to change the content of some <summary> into links as they are being generated. The content of the <summary> may be text or an <img> and text. Since appendChild doesn’t allow me to append a NodeList, my alternative for this was to cycle through the <summary> children and add them to the link, then append the link to a replacement <summary>. Unfortunately, the for loop never accessed the second child.
for (var j = 0; j < curSummary.childNodes.length; j++) {
// ...
}
I verified that curSummary.childNodes.length is actually 2 but the loop only ever executed once for each <summary>. Putting an alert in to display the value of the loop variable showed it was only ever 0.
alert('there are' + curSummary.childNodes.length + ' nodes');
for (var j = 0; j < curSummary.childNodes.length; j++) {
alert('appending child node ' + j + ' of ' + curSummary.childNodes.length);
}
Apart from omitting the text, the code worked. The summary showed up with <img> as a link. Just to be clear, both the image and text are displayed when there isn’t a link.
And no, I’m not changing the value of the loop variable nor issuing a “break” anywhere in the loop.
