By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,521 Members | 1,248 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,521 IT Pros & Developers. It's quick & easy.

writing to a give table element

P: n/a
mxa
Hi,
given table :
<table id='t1'>
<tr><td> data1</td><td>data2</td></tr>
</table>

i would like to write a function to write and change data2
( location is fixed ).

function changeme () {

document.write('new data2');

}

how can I focus on 'data2' before calling the above function?
thanks
Michael

Jul 23 '05 #1
Share this Question
Share on Google+
5 Replies


P: n/a
mx*@yahoo.com wrote:
Hi,
given table :
<table id='t1'>
<tr><td> data1</td><td>data2</td></tr>
</table>

i would like to write a function to write and change data2
( location is fixed ).

function changeme () {

document.write('new data2');

}

how can I focus on 'data2' before calling the above function?
thanks
Michael


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<script type="text/javascript">
//<![CDATA[

function changeme()
{
var tbl = document.getElementById('t1'); //table
var firstrow = tbl.rows.item(0); //row 1 (DOM: 0)
var cell2 = firstrow.cells.item(1); //2nd TD
while (cell2.hasChildNodes()) //anything in there?
cell2.removeChild(cell2.lastChild); //adios
cell2.appendChild(document.createTextNode('new data2')); //new text
node, add
}

onload = function()
{
setTimeout(changeme, 3000);
}

//]]>
</script>
</head>
<body>
<table id="t1" cellspacing="10">
<tbody style="font:32px tahoma;">
<tr>
<td>data1</td>
<td>data2</td>
</tr>
</tbody>
</table>
</body>
</html>

http://www.sitepoint.com/article/rough-guide-dom

Jul 23 '05 #2

P: n/a
Just a note: could also go -

var tbody =
document.getElementById('t1').getElementsByTagName ('tbody').item(0);
var firstrow = tbody.rows.item(0);
Another ref:

http://www.brainjar.com/dhtml/intro/

Jul 23 '05 #3

P: n/a
RobB wrote:
[...]

Now there's an easy way and a hard way...

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Change Data2</title>

<script type="text/javascript">
function changeme(ele,str) {
var tbl = document.getElementById(ele);
t1.innerHTML = str;
}
</script>

</head>
<body>
<table cellspacing="10">
<tbody style="font:32px tahoma;">
<tr>
<td>data1</td>
<td id="t1">data2</td>
</tr>
</tbody>
</table>

<div onclick="changeme('t1','Here is the new text');" style="
font-family: tahoma;
border: 1px solid blue;
background-color: #ddddee;
width: 20em;">Click here to to change the text</div>
</body>
</html>

I reckon that's the easy way! :-)

Of course, getElementsById is not compatible with older browsers and
innerHTML, whilst well supported, is not part of the official DOM. So
if this is for real web use, let us know and we'll post something a bit
more robust (but it'll take a few more lines of code...)

--
Fred
Jul 23 '05 #4

P: n/a
Fred Oz wrote:
RobB wrote: [...] <script type="text/javascript">
function changeme(ele,str) {
var tbl = document.getElementById(ele);
t1.innerHTML = str;
}
</script>


Believe it or not, the above rubbish worked in Safari. My apologies,
the correct code is below.

<script type="text/javascript">
function changeme(ele,str) {
var d = document.getElementById(ele);
d.innerHTML = str;
}
</script>

--
Fred
Jul 23 '05 #5

P: n/a
Fred Oz wrote:
Fred Oz wrote:
RobB wrote: [...]
<script type="text/javascript">
function changeme(ele,str) {
var tbl = document.getElementById(ele);
t1.innerHTML = str;
}
</script>


Believe it or not, the above rubbish worked in Safari. My

apologies, the correct code is below.

<script type="text/javascript">
function changeme(ele,str) {
var d = document.getElementById(ele);
d.innerHTML = str;
}
</script>

--
Fred


Fred:
some leisure reading.

http://www.developer-x.com/content/innerhtml/

Jul 23 '05 #6

This discussion thread is closed

Replies have been disabled for this discussion.