JAVASCRIPT - Simple Function to Create Event Listener - Javascript Source Code

JAVASCRIPT - Simple Function to Dynamically Create Element Event Listener withing the Html Body, Quickly & More Easily

The following code is a way to make it quicker and easier to create an event listener in Javascript. Save this block of code in your Javascript Library, and in a web page where you intend to create more than one or two event listeners, save yourself some typing with this simple function code to create event listeners on the fly, within the body/html of the web page.

function funcEvtListener(elemId, whatEvent, funcName){ let theElem = document.getElementById(elemId); if(theElem.addEventListener){ theElem.addEventListener(whatEvent, funcName); }else if(theElem.attachEvent){ theElem.attachEvent(whatEvent, funcName); } }

Example of how to use this function:

<button id="btnClick">click</button> <button id="btnTarget">target</button> <script> funcEvtListener('btnClick', 'click', funcAlert) function funcAlert(){ alert('Alert Box!'); } function funcEvtListener(elemId, whatEvent, funcName){ let theElem = document.getElementById(elemId); if(theElem.addEventListener){ theElem.addEventListener(whatEvent, funcName); }else if(theElem.attachEvent){ theElem.attachEvent(whatEvent, funcName); } } </script>

Try it yourself. Right click the page and click View Source to inspect the source code to see how this works. In this example the event listeners for both buttons point to the same function, they can point to different functions.

Click Event Double Click Event