View Full Version : innerText equivalent for Mozilla

09-03-2004, 03:09 AM
the scenario...
getting the content of a div then putting that string in a textarea.
the problem is that there are links in the content.. which I thought I could solve by making the function recursive but it seems to not act as I had expected. IE returns exactly what I need.

Also, how would I be able to get the newline to be passed as well ?

BTW, I did try searching.. and I think my issue is probably more with the recursiveness since it seems to end after getInnerText() is called again.

var txt
function getInnerText(o)
children = o.childNodes
children_len= children.length
for (var i=0; i<children_len; i++) {
if (children.item(i).childNodes.length>0) {
} else if (children.item(i).nodeType==3) {
txt += children.item(i).nodeValue

here is a sample div:

<div id="text_3" onClick="getInnerText(this);alert(txt)" style="cursor:pointer;cursor:hand;font-family:Times;font-size:8pt">31sadfasdf <a href="http://www.domain.com/?msg=21&link=http%3A%2F%2Fwww.test.com%2F">http://www.test.com/</a><br>adsfasdfadsf<br>asdfadsf<br>adsfadsf</div>

Mr J
09-03-2004, 04:12 PM
Sorry mis-read your post

09-03-2004, 05:11 PM
I posted this on a mailing list I'm on and someone was able to help me..
he replied with:

You aren't returning anything from recursion.

// untested, but should do the trick
function getInnerText(o)
var txt = "";
var i;

for(i = 0; i < o.childNodes.length; i++)
if(o.childNodes[i].nodeType == 1 /* ELEMENT_NODE */)
txt += getInnerText(o.childNodes[i]);
if(o.childNodes[i].nodeType == 3 /* TEXT_NODE */)
txt += o.childNodes[i].nodeValue;


As far as newlines go: you are, in general, not guaranteed anything
about whitespace in HTML - you may or may not get newlines depending
on browser & JavaScript implementation. The only way you can
force whitespace/newline preservation is enclosing the relevant text
in <![CDATA[ ... ]]> tokens,


so... I ended up with this:

function getInnerText(o)
var txt='';
for (var i=0; i<o.childNodes.length; i++) {
switch(o.childNodes[i].nodeType) {
case 1 : txt += getInnerText(o.childNodes[i]); break
case 3 : txt += o.childNodes[i].nodeValue; break
case 8 : txt += "\n"; break

return txt;

I'm using comment nodes(<!--#-->) to signify the \n.

05-07-2008, 11:22 AM

You can use "textContent" in mozilla which is equivalent to "innerText" in IE.


05-07-2008, 09:35 PM
You don't need a recursion. You may simply use the getElementsByTagName() method -with a wild card as argument - and nextSibling(). You may also remove the gaps or the carriage return on using RegExp.

Could be something like this:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<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 addText(obj,txt){
obj.firstChild?obj.firstChild.nodeType==3?txt+=(obj.firstChild.nodeValue+' '):null:null;

return txt;
function getInnerText(obj){

var txt='';
var ele=obj.getElementsByTagName('*'), i=0, e;
e.nextSibling?e.nextSibling.nodeType==3?txt+=(e.nextSibling.nodeValue+' '):null:null;
txt=txt.replace('\n','','g').replace(/\s{1,}/g,' ').replace(/\s$/,'');//removes the gaps and the last space
return txt;
<div id="text_3" onclick="alert(getInnerText(this))" style="cursor:pointer;cursor:hand;font-family:Times;font-size:8pt">

<div>foo<span>fee </span></div>

<a href="http://www.domain.com/?msg=21&link=http&#37;3A%2F%2Fwww.test.com%2F">http://www.test.com/</a><br>adsfasdfadsf


rnd me
05-08-2008, 12:58 AM
far simpler and slightly faster crossbrowser code:

function getInnerText(o)
return o.textContent ? o.textContent : o.innerText