473,806 Members | 2,967 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

attaching a method to DOM elements

I've been thinking the replies to my earlier post. I can attach
a method to a DOM element as below. But instead of
assigning it to each element individually, I would rather
have it as a method of every DOM element (and failing
that, as a method of all javascript objects) - that would
be much more tidy and memory conscious.

What is the proper syntax for this, because I can't seem
to get it to work on either IE 6 or Firefox 1.0.1 with
..prototype, .__prototype__, .__parent__, or
new Closure (that's obsolete, right?) - or is this not doable?
The idea, of course, if I understand things right, would be to
have showMe (and sorry if I'm butchering the terminology) as a
method on the prototype of all DOM elements so the 'this'
will be appropriately bound when the function is entered.
<body onLoad="tryit() "><div
id=myDiv>Placeh older</div>
<script type='text/javascript'>
showId = function() {
try { var base = "This " + this.tagName + " has ";
if (!this.id) alert(base + "no id");
else alert(base + "id: " + this.id); }
catch(e) {alert("elem has no id");}
}
var aAll = document.all || document.getEle mentsByTagName( "*");
for (var idx in aAll) aAll[idx].showId = showId;
function tryit() {
document.body.s howId(); // will show This BODY has no id
document.body.c hildNodes[0].showId(); // will show myDiv
}
</script></body>

Thanks,
Csaba Gabor from Vienna

Jul 23 '05 #1
2 2290
Csaba2000 wrote:
I can attach
a method to a DOM element as below. But instead of
assigning it to each element individually, I would rather
have it as a method of every DOM element


Here is an example for Geckos and MSIE 5.5+ that adds a method showid()
to all HTML elements in the document by using the HTMLElement prototype
in Geckos and using a CSS Behavior in MSIE:

,-----[ showid.html ]-----
| <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
| "http://www.w3.org/TR/html4/strict.dtd">
| <html>
| <head>
| <meta http-equiv="Content-Script-Type" content="text/javascript">
| <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
| <title>insertAf ter-Test</title>
| <!--[if gte ie 5.5]>
| <style type="text/css">
| * { behavior:url(ie showid.htc) }
| </style>
| <![endif]-->
| <script type="text/javascript" src="mozshowid. js"></script>
| <script type="text/javascript">
| window.onload = function() {
| var oB, aBC;
| if ((oB = document.body) && "undefined" != typeof oB.showId) {
| oB.showId();
| }
| if (oB && (aBC = oB.childNodes) && aBC[0] && "undefined" != typeof aBC[0].showId) {
| aBC[0].showId();
| }
| }
| </script>
| </head>
| <body><div id="myDiv">Plac eholder</div></body>
| </html>

,-----[ mozshowid.js ]-----
| if (typeof HTMLElement != "undefined" && HTMLElement.pro totype) {
| HTMLElement.pro totype.showId = function() {
| alert(
| "This " + this.tagName + " has " +
| (this.id? "id: " + this.id : "no id")
| );
| };
| }

,-----[ ieshowid.htc ]-----
| <public:compone nt>
| <public:metho d name="showId" />
| <script type="text/jscript">
| function showId() {
| alert(
| "This " + this.tagName + " has " +
| (this.id? "id: " + this.id : "no id")
| );
| }
| </script>
| </public:componen t>

ciao, dhgm
Jul 23 '05 #2
Csaba2000 wrote:

[snip]
What is the proper syntax for this, because I can't seem
to get it to work on either IE 6 or Firefox 1.0.1
As far as I know, prototyping elements is only possible with
Mozilla-like browsers. It certainly isn't with IE or Opera (though
Opera does expose some interfaces which possess static members like Node).
with .prototype,
This is the one to use. All HTML elements are objects implementing the
HTMLElement interface:

/* Firefox types HTMLElement as an object.
* Other user agents may choose function.
*/
if(('object' == typeof HTMLElement)
&& ('object' == typeof HTMLElement.pro totype))
{
HTMLElement.pro totype.showId = function() {alert(this.id) ;};
}

You can be more specific by using the DOM-defined interface names for
the various element types, such as HTMLSelectEleme nt and
HTMLParagraphEl ement. Note that some simple elements do not have their
own interface and implement only HTMLElement. These elements are
listed in the DOM HTML specification in section 1.6.4 - The
HTMLElement interface.
[...] new Closure (that's obsolete, right?)
That one's new to me.
- or is this not doable?


In general, no it isn't.

[snip]

Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.
Jul 23 '05 #3

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

6
9943
by: Yvan J. Gagnon | last post by:
I am currenly developing a web site using Macromedia fireworks, and am trying to figure out a way (through hand-coding) of attaching a javascript function (onClick="doit=false") to each of the links in my fireworks-generated dhtml popup menus. Does anyone here know where I would add this javascript fucntion in the code so that it would be recognized? And do I do it in the html, or in the JS file? The javascript function I need to add is...
5
1709
by: nukiboy | last post by:
========= test.js =================== function Test() { this.temp = "hehehehe" ; this.method1 = method1 ;
5
2359
by: knocte | last post by:
Hello. I am a web developer very worried about "bloat code" and "languages mixture". So, since some time, I always try to avoid completely the use of javascript in XHTML/HTML files. This leads to me to hate, also, any event (onload, onchange, ...) instanciated in the element tag itself, like: <input type="text" onkeyup="return doSomething();" /> I would replace this code above with an input element marked with an
1
1321
by: wh | last post by:
This is more a question of style really, nothing too technical - honest. My question is what is the preferred way of defining the styles of elements in an asp.net page? Supposing I have several *Web* controls (i.e. <asp:label> elements) that I want to apply a formatting style to. The first method would be to select all controls in page design view then set the appearance properties in the properties window. The other method would be to...
5
4548
by: | last post by:
I am wondering what the best method of attaching custom Events to custom WebUserControls are. I cannot seem to find the proper terminology to expand my research. Basicallly I have a custom user control that has 2 or 3 events selectionChanged DropDownOpened I would like the user to be able to attach Server Side events for both. I have the client side implementation worked out. I just need to find a proper way to to get everything...
2
2255
by: john.lehmann | last post by:
Attacked is a piece of code which first hits the login page successfully and receives back login cookies. But then when I attempt to hit a page which is restricted to logged in users only, I fail. That seems to be because I am not successfully re-attaching the cookies to the header portion of the this request. I have tried 2 methods which should both work I think. The first was to use install_opener to attach the cookie handler back...
3
1359
by: zzzbla | last post by:
Hi, I need to attach a javascript function I wrote to the onChange event of a <select> tag. However, I'm using a 3rd party tool that creates the html files - it only lets me add bits of html to it, I can't touch the elements it produces, so I can't just add an onChange="myfunction" attribute to that <select> tag. I can't change the onload attribute of the <body> tag. How can I run code that attached my function to that event?
3
1446
by: tswaters | last post by:
What a pain. I just pressed "Preview Post" only to find that the server forgot who I was and killed my input. So, where once I had everything described really nice, now I'm just going to write my code and assume everyone is intelligent enough to figure it out: <html> <body onLoad="init();"> <div id="b"></div> </body> </html>
1
1771
by: moltendorf | last post by:
I have a simple XMLHttpRequest that grabs a list of messages from my server (I posted a question for a different aspect of this earlier) I have decided to improve on it a little by adding in things that my message logger does (server-side) to turn things like: http://www.example.com or: http://example.com into URLs automatically by slapping on <a href="http://www.example.com" target="_blank">www.example.com</a> when: www.example.com
0
10620
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...
0
10369
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth. The Art of Business Website Design Your website is...
1
10372
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
0
10110
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
0
9187
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...
0
5546
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
0
5682
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
1
4329
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
2
3851
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.