Variable after dot

Question

My question is simple: Is there a way to have the event as a variable or any variable after a dot in general? Is there a way to do something like this?

var type = "onkeyup";
document.getElementById("test").type = myFunction;

or

var element = "body";
document.element.style.marginTop = 0;

Answer 1

Use [] notation instead of dot .. The reason is square bracket allows to deal with variable property names.

var type = "onkeyup";
document.getElementById("test")[type] = myFunction;

function myFunction() {
  alert('worked')
}

<input id='test'>

Answer 2

Similar to the comment provided by Mr_Green above:

var myEvent = "onkeyup";
myInput[myEvent] = function() {}

Here is a Fiddle: https://jsfiddle.net/43ceL4gf/

Answer 3

You could use addEventListener and the event as string.

The EventTarget.addEventListener() method adds the specified EventListener-compatible object to the list of event listeners for the specified event type on the EventTarget on which it's called. The event target may be an Element in a document, the Document itself, a Window, or any other object that supports events (such as XMLHttpRequest).

document.getElementById('test').addEventListener('pointerdown', myFunction, false);
//                       id
//                              add an event listener
//                                               event type
//                                                              callback
//                                                                          options

Answer 4

Your code is close to solution except .type use [type]

Example here

<input type="button" value="Click me" id="test">

var type = "onclick";
document.getElementById("test")[type] =function myFunction(){
alert("Button Clicked");
}

JSfiddle link