IE6: setInterval, this==window arrgh

[Richard A. DeVenezia]

At line
this.timerId = setInterval (function(){thi s.step()}, 100)
I get error dialog
Error:Object doesn't support this property or method.
If I change it to
this.timerId = setInterval (function(){thi s==window}, 100)
I see true, the sad fact that 'this' is window and not an anim.

What are some proper ways ?
I would like to avoid
this.timerId = setInterval ("Anim.step ( ' "+ this.o.id + " ' ) ", 100)
and avoiding the need for a global hash array (Anim.anims) to keep tracking
of my anims (key:td id, value:anim instance) that would have to be looked up
during each step.

--------
function X (s,cp) {
// cp - cell id prefix
document.write (
'<P>' + s + '</P>'
+'<TABLE BORDER="1">'
+ '<TR>'
+ '<TD ID="cell_1"'
+ ' onMouseOver="X. over(this)"'
+ ' onMouseOut="X.o ut(this)"'
+ '>this cell gets handled</TD>'
+ '<TD ID="cell_2"'
+ ' onMouseOver="X. over(this)"'
+ ' onMouseOut="X.o ut(this)"'
+ '>me too</TD>'
+ '</TR></TABLE>'
)

}

function X.over (o) { o.style.backgro und='Black' }
function X.out (o) {
o.anim = new Anim(o);
o.anim.start();
}

var Anim = function (o)
{
this.o = o
this.count=0
}
Anim.prototype. start = function ()
{
this.step();
this.timerId = setInterval (function(){thi s.step()}, 100)
}
Anim.prototype. step = function ()
{
this.count += 4
if (this.count > 15)
this.stop()
else {
level = anim.count * 16 - 1
anim.o.style.ba ckground = 'rgb('+level+', '+level+','+lev el+')'
}
}
Anim.prototype. stop = function ()
{
clearTimeout (this.timerId)
}
-----

--
Richard A. DeVenezia, subclassing Text Pad Control
http://www.devenezia.com/downloads/s...ndex.php?id=22

[Lasse Reichstein Nielsen]

"Richard A. DeVenezia" <ra******@ix.ne tcom.com> writes:

As you stated prior it's not good practice or valid to add custom properties
to HTML tags, but how about post rendering of the HTML ? This works, but is
adding properties to existing window objects.

document.write( '<td id="foo" onmouseout="Out (this)"> .... </td>');
document.getEle mentById("foo") .adjunctData = { a:1, b:2, c:'I will appear',
d:4, e:5, f:6 }
This is quite legal.

The HTML specification is strict - it disallows attributes not in the
specification.

There is nothing in the DOM specification that recommends against
adding properties to DOM node objects. In Javascript, the DOM nodes
are just normal host objects, and they can allow you to add whatever
properties you want. However, as host objects, they could also prevent
it. Host objects are almost completely "implementa tion dependent" in
the ECMA 262 standard.
After a fair amount of experimentation , I found I could build the table
without document.writin g any HTML at all!
Not sure how cross-browser this is, but works for my windows IE6 and is spot
on for my personal style.
You use DOM methods to add rows and cells to the table. While not the
fastest method (I find using document.create Element("td") to be a
little faster in some browsers), it is still a very valid approach.

But, be careful:
document.write (
'<P>' + s + '</P>'
+'<TABLE ID="myTable" BORDER="1" CELLPADDING="10 "></TABLE>'
A valid table tag *must* include at least "<tr><td>" (and I would
include the end tags as well). If you care about invalid attributes,
you should also make sure that the HTML you document.write, is valid.
(I would also remove BORDER and CELLPADDING and use CSS instead).
table = window.myTable;
// is document.getEle mentById really needed if window.<id> or
window['<id>'] seems to always work ?
IE makes named elements available as global variables. Few other
browsers do.
row = table.insertRow (0);
cell = row.insertCell (0);

cell.innerHTML = 'Show me'
Now that you are using DOM, you might as well be consistent:

cell.appendChil d(document.crea teTextNode('Sho w me'));
cell.foo = '123'
cell.adjunctDat a = { a:1, b:2, c:'I will appear', d:4, e:5, f:6 }
cell.onmouseove r = function (EventSource) { X.over (this) } // during
invocation context this is the cell
}

X.over = function (o)
{
o.innerHTML = o.adjunctData.c

If we know that o contains only one text node:
o.firstChild.no deValue = o.adjunctData.c ;
Otherwise, we must clear out the contents of the node, and write
the new:
while(o.hasChil dNodes()) {
o.removeChild(o .lastChild);
}
o.appendChild(d ocument.createT extNode(o.adjun ctData.c));

Enjoy
/L
--
Lasse Reichstein Nielsen - lr*@hotpop.com
Art D'HTML: <URL:http://www.infimum.dk/HTML/randomArtSplit. html>
'Faith without judgement merely degrades the spirit divine.'