Way(s) to dynamically change text content

[michael]

I have an html text string within a div, eg.:

<div id="example">Text text text</div>

I know its easy to change styles by using getElementById - for example:

document.getElementById("example").style.fontColor ="#ff0000";

But what way(s) are there to change the actual text content itself on the
page dynamically, from "Text text text" to"Bla bla bla" ?

Can it be done with JS/CSS?

[Hywel Jenkins]

In article <cr*************@news.t-online.com>, no****@example.com
says...

I have an html text string within a div, eg.:

<div id="example">Text text text</div>

I know its easy to change styles by using getElementById - for example:

document.getElementById("example").style.fontColor ="#ff0000";

But what way(s) are there to change the actual text content itself on the
page dynamically, from "Text text text" to"Bla bla bla" ?

Can it be done with JS/CSS?

document.getElementById('example').innerHTML = 'New text';

--
Hywel http://kibo.org.uk/
I do not eat quiche.

[Martin Honnen]

michael wrote:

I have an html text string within a div, eg.:

<div id="example">Text text text</div>
But what way(s) are there to change the actual text content itself on the
page dynamically, from "Text text text" to"Bla bla bla" ?

It is possible to set the text, to cope with various browsers from IE 4,
5, 6, Netscape 6, 7, Mozilla, Opera 7, 8 and other DOM compliant
browsers you can use:
function setInnerText (elementId, text) {
var element;
if (document.getElementById) {
element = document.getElementById(elementId);
}
else if (document.all) {
element = document.all[elementId];
}
if (element) {
if (typeof element.textContent != 'undefined') {
element.textContent = text;
}
else if (typeof element.innerText != 'undefined') {
element.innerText = text;
}
else if (typeof element.removeChild != 'undefined') {
while (element.hasChildNodes()) {
element.removeChild(element.lastChild);
}
element.appendChild(document.createTextNode(text)) ;
}
}
}
setInnerText('example', 'Kibology for all.')

--

Martin Honnen
http://JavaScript.FAQTs.com/

[E Michael Brandt]

Thank you Martin - very useful info.

--

e michael brandt
michael at valleywebdesigns.com
www.valleywebdesigns.com ::: home of justso picturewindow & photoalbum

--
Martin Honnen wrote:

michael wrote:

I have an html text string within a div, eg.:

<div id="example">Text text text</div>

But what way(s) are there to change the actual text content itself on
the page dynamically, from "Text text text" to"Bla bla bla" ?

It is possible to set the text, to cope with various browsers from IE 4,
5, 6, Netscape 6, 7, Mozilla, Opera 7, 8 and other DOM compliant
browsers you can use:
function setInnerText (elementId, text) {
var element;
if (document.getElementById) {
element = document.getElementById(elementId);
}
else if (document.all) {
element = document.all[elementId];
}
if (element) {
if (typeof element.textContent != 'undefined') {
element.textContent = text;
}
else if (typeof element.innerText != 'undefined') {
element.innerText = text;
}
else if (typeof element.removeChild != 'undefined') {
while (element.hasChildNodes()) {
element.removeChild(element.lastChild);
}
element.appendChild(document.createTextNode(text)) ;
}
}
}
setInnerText('example', 'Kibology for all.')

[michael]

Thanks - that solved my problem.