Skip to content
Advertisement

How to get Events associated with DOM elements?

I have an HTML document.
It is possible to get the events associated with every Element in a particular FORM element in the document using JavaScript.

var element = document.forms[i].elements[j];

This way I can get jth element in ith form, But can I get the event associated with the element.
There can be any number of elements in a form. I am using IE 8.



**EDIT :**
Actually I was trying to serialize HTML DOM into XML.

what I did to do this was :

createXML : function() {
        
        objSerializeDOM.msg += "";
        objSerializeDOM.msg += "<?xml version='1.0' encoding='UTF-8'?>nn";
        // Get all the forms in a document.
        var forms = document.forms;

        for ( var i = 0; i < forms.length; i++) {
            // Get all the elements on per form basis.
            elements = document.forms[i].elements;
            objSerializeDOM.msg += "<FORM name="" + forms[i].name + "" method=""
                    + forms[i].method + "" action="" + forms[i].action + "">nn";
            for ( var j = 0; j < elements.length; j++) {
                objSerializeDOM.msg += "    <" + elements[j].tagName + "  type=""
                        + elements[j].type + """ + "  name=""
                        + elements[j].name + """ + "   Value =""
                        + elements[j].value + ""  />n";
            }
            alert(document.forms[i].elements[1].event);
        }
        objSerializeDOM.msg += "nn</FORM>nn";
        alert(objSerializeDOM.msg);
        objSerializeDOM.writeToFile(objSerializeDOM.msg);
    }

What I am getting from this is an XML :

<?xml version='1.0' encoding='UTF-8'?>

<FORM name="loginForm" method="post" action="/sigma/login.do;jsessionid=E6509E7BA55573AA5386274ABB93F718">

    <INPUT  type="hidden"  name="message"   Value =""  />
    <INPUT  type="hidden"  name="userAction"   Value =""  />
    <INPUT  type="text"  name="userId"   Value =""  />
    <INPUT  type="password"  name="passwd"   Value =""  />
    <INPUT  type="button"  name="button"   Value ="Continue"  />


</FORM>

Now suppose I have:

<input tabindex="7" name="button" type="button" class="button"
                style="width:100;height:30" Value="Continue" onclick='login()' />

All I want to do now is to get onClick in my XML or any event associated like onBlur() etc.

Advertisement

Answer

As Felix said in his comment, there are several ways to register an event on an object. So how you can get the events attached to an object and serialize them somehow to your xml depends on how they are registered. I will list some thoughts of how you can get them for serialisation.

1 Handlers registered inline

1.1 Completely inline code:

<INPUT  type="hidden"  name="message"   Value =""  onclick="alert('hello')"/>

When the code is completely inline, you can just get the attribute in your xml and save it.

2.1 Inline function call

In this case you would have to export the declaration of the function. In JavaScript Functions are objects itsself so you could actually get the declaration text of your function by invoking myFunc.toString(). The hard part on this would be to figure out, if this is a function call where the declaration hast to be exported or not.

2 Handlers registered through attributes

If you have added all your element Handlers through i.e. :

function myFunc(num){
  alert("Your number is: " + num);
}

document.getElementById('myElement').onclick = myFunc;

you could just iterate your form elements like you already do and get the onlick, onmouseover, onblur, on…. properties all one by one and save them to xml. Also in this case the content of this propertys will be Function Objects as well so to save their actual content you have to do .toString() on the Function object.

In addition there are some other ways to register Event handlers depending on the different Browsers. So if you definetly know how your events are registered, you can actually serialize them. If you don’t that’s going to be very difficult.

I hope that helps to get you a bit further.

User contributions licensed under: CC BY-SA
3 People found this is helpful
Advertisement