What is this?? (Dom drag script)

[shachi]

1) Script Title: Dom Drag Script

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...omdrag/dev.htm

I downloaded the dom drag script from dd and I tried taking a look at the source to see how the custom events (ondragstart, ondragend ...) were made and I saw this piece of code:

o.root.onDragStart	= new Function();
		o.root.onDragEnd	= new Function();
		o.root.onDrag		= new Function();

Now what is the o.root in that code?? I couldn't get my head around this. I have googled but I failed to find anything like .root. Can anyone tell me what that is and how it is used?? And if possible can anyone also tell me how to make custom events like (e.g)onscrolldown ??

If I am right custom events are just giving a new value to a method but if I am not then please explaing it to me. Thanks in advance.

[Twey]

This script does something a bit dodgy, in adding custom properties to a DOM node. HTML is a standard, and you're not really supposed to add arbitrary properties to HTML elements (I found out after basing several scripts on the ability to do so in most browsers ).

[shachi]

Are there any tutorials and/or references which I can follow to know more about this subject?? And can you also tell me how do I add custom properties in the DOM node?? Is it jus the element.root.someproperty or is there something else to do? I am really curious about this matter now. Thanks.

[Twey]

And can you also tell me how do I add custom properties in the DOM node??

Most browsers will let you get away with just element.property = value, but it is non-standard and should not be used. The same effect can be achieved (if in a more roundabout way) with the Javascript equivalent of a hashtable.

[shachi]

Most browsers will let you get away with just element.property = value, but it is non-standard and should not be used.

What shall I use then?? How do I make (standard)custom properties??

The same effect can be achieved (if in a more roundabout way) with the Javascript equivalent of a hashtable.

Javascript hashtable?? What is it, where can I learn more about it?? Can you please tell me all about it??

Sorry if I am asking too many questions but I am really curios about it.

[Twey]

How do I make (standard)custom properties??

You don't. That's the point.

Javascript hashtable?? What is it, where can I learn more about it?? Can you please tell me all about it??

All objects in Javascript are hashtables. Consider:

var business = {
  'product' : 'fish'
  'sales' : 10000
};

myObject.employees = 30;

alert(business['sales']); // 10000
alert(business['employees']); // 30
alert(business['product']); // fish

[mwinter]

All objects in Javascript are hashtables.

That is an oft repeated fallacy; they are not. With certain limitations, objects can be used like hash tables (or more accurately associative arrays: there is no hashing mechanism involved), but that's not the same thing.

If you want a reliable hash-like structure, you have to implement it yourself.

Mike

[shachi]

You don't. That's the point.

So, is it better to not to create custom properties??

[mburt]

I don't think you can create custom properties, but again, I'll probably be corrected on this one

[Twey]

So, is it better to not to create custom properties??

You do not, should not, and must not create custom properties on a DOM node.

mburt: You can. Consider:

<img src="someimage.png" name="first">
<script type="text/javascript">
  document.images['first'].originalSource = document.images['first'].src;
</script>

This will work in most Javascript parsers (but not KJS, I believe). However, it shouldn't be done; it is equivalent to using custom attributes:

<img src="someimage.png" originalSource="someimage.png" name="first">

... and as such is bad.