updating elements with getelementsbyid

[DennyLoie]

Hi everyone,

I am trying to update the value which is stored in a particular part of my page by using the getElementsById method, followed by calling a function to update the field. However, I don’t know how to do this. The relevant parts of my code are as follows:


function text(t)
{
return document.createTextNode(t);
}
function start(){

var oHelloText = text(getQuestion()); //the getQuestion method returns a string from an array
oHelloText.id = "test";
}

function updateDetails()
{
document.getElementById('test') = text(getQuestion());
}

//sometime later, call to updateDetails method.

Unsurprisingly, this doesn’t work.

Any advice?

[Raffles]

You can't give Text Nodes IDs. You have to give an element the ID and the element then contains the text node. You can append the text node to the element using appendChild.

[DennyLoie]

I see.

I went a layer up and gave the id to my P, which contains the text node.

I then wrote this (where 'test' now refers to the holder of the text node).

function updateDetails()
{
var zzz = (document.getElementById('test'));
zzz.removeChild(zzz.firstChild);
zzz.appendChild(text(getQuestion()));

}

This works, but doesn't seem very efficient. Is there a more suitable way?

[Raffles]

function updateDetails()
{
var zzz = (document.getElementById('test'));
zzz.firstChild.nodeValue = text(getQuestion);
}

or even:

function updateDetails()
{
document.getElementById('test').firstChild.nodeValue = text(getQuestion);
}