PDA

Click to See Complete Forum and Search --> : circle all the childNodes

Kor
05-20-2005, 05:11 AM
I wanna get all the text nodes of the children of an element. The goal is to get an array with all the textNodes in each cell of a table, without any other nodes that might ocure whithin that cell (<p>, <br> etc...)

I mean if:
<td>12</td>
<td>1<p>23<b>34</b>5</p>6</td>
I need:
var txt = new Array()
txt[0] = '12';
txt[1] = '123456';

Now I had to circle through all the childNodes to extract all the text nodes. I have build a function, but something is wrong in the code, and I don't sense what. I need soime fresh eyes, any ideeas? Where's the mistake?:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<script type="text/javascript">
function checkCell(){
var allC = document.getElementById('tab').getElementsByTagName('td');//cells' collection
var txt = new Array()
for(var i=0;i<allC.length;i++){
txt[i]='';
var chC = allC[i].childNodes;
for(var j=0;j<chC.length;j++){
while(chC[j].hasChildNodes()){
chC[j]=chC[j].firstChild;
}
txt[i]+=chC[j].data;
}
}
alert(txt[1])
}
onload=checkCell;
</script>
</style>
</head>
<body>
<table id="tab" width="400" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>12</td>
<td>1<p>23<b>34</b>5</p>6</td>
</tr>
</table>

</body>
</html>


It looks like

while(obj.hasChildNodes()){
obj = obj.childNodes[0]
}
or
while(obj.hasChildNodes()){
obj = obj.firstChild;
}

is not correct. Why?
Charles
05-20-2005, 05:32 AM
Is this what you are up to?<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="Content-Script-Type" content="text/javascript">
<meta name="Content-Style-Type" content="text/css">
<title>Example</title>

<script type="text/javascript">
<!--
if (document.getElementById) onload = function () {
var e, i = 0, t = '';
while (e = document.getElementsByTagName ('P')[0].childNodes[i++]) {if (e.nodeName == '#text') t += e.nodeValue}
alert (t);
}
// -->
</script>

</head>
<body>
<p>Eodem modo typi,<br> qui nunc nobis videntur parum clari,<br> fiant sollemnes in futurum.</p>
</body>
</html>
Kor
05-20-2005, 05:42 AM
almost. But I need no tag to be specified, as the text might have a lot of tags here and there, <p>, <b>, <font>, <br> and so on... I need to extract a text from a cell without any inner tag which might occure.... Further more, some of those tags migh have another child tags inside
ex:
<td>there is <p>some <b>text</b> here<p> text again</td>

, so that I have to find a general way to circle through this nodes till I get the text and concatenate it to the final

there is some text here text again

I have to get rid of all the tags which might ocure, nomatter the length of the possible nodes inside the element (the cell in my case, but that is not important).
BigMoosie
05-20-2005, 06:34 AM
This is my solution, I 'm pretty sure its what you are after:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="Content-Script-Type" content="text/javascript">
<meta name="Content-Style-Type" content="text/css">
<title>Example</title>

<script type="text/javascript">
<!--

function findTextNodes(){
var e, i = 0, t = '';
while (e = arguments[0].childNodes[i++]) {
if (e.nodeName == '#text') t += e.nodeValue;
if (e.hasChildNodes()) t+=findTextNodes(e);
}
return t;
}
window.onload=function(){
alert(findTextNodes(document.getElementsByTagName('P')[0]));
}
// -->
</script>

</head>
<body>
<p>Eodem modo typi,<br> qui nunc <B>nobis <I>&quot;deep node&quot;</I></B> videntur parum clari,<br> fiant sollemnes in futurum.</p>
</body>
</html>