.on() event handling in JavaScript (jQuery-like)

Developer
Jelmer
Size
2,514 Kb
Views
12,144
  1. .on() event handling in JavaScript (jQuery-like) Previews
  2. .on() event handling in JavaScript (jQuery-like) HTML Codes
  3. .on() event handling in JavaScript (jQuery-like) CSS Codes
  4. .on() event handling in JavaScript (jQuery-like) JS Codes

How do I make an .on() event handling in javascript (jquery-like)?

Enables you to handle events in the simple .on(event, function) way that jQuery offers. But then without the rest of jQuery (look ma no jquery!!1!). Just your own JavaScript. :). What is a .on() event handling in javascript (jquery-like)? How do you make a .on() event handling in javascript (jquery-like)? This script and codes were developed by Jelmer on 02 December 2022, Friday.

.on() event handling in JavaScript (jQuery-like) Previews
IQ Test

.on() event handling in JavaScript (jQuery-like) - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>.on() event handling in JavaScript (jQuery-like)</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css"> <link rel="stylesheet" href="css/style.css">
</head>
<body> <h1>Click us</h1>
<p>This is a paragraph. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Corporis, fugiat.</p>
<ul>
<li>A list item</li>
<li>Another list item </li>
</ul>
<div class=log></div> <script src="js/index.js"></script>
</body>
</html>

.on() event handling in JavaScript (jQuery-like) - Script Codes CSS Codes

.log { color: blue;
}

.on() event handling in JavaScript (jQuery-like) - Script Codes JS Codes

var doc = document, elements = doc.querySelectorAll('h1, p, li'), log = doc.querySelector('.log');
doc.addEventListener('DOMContentLoaded', function() { elements.on('click', function() { log.innerHTML = this + ' clicked!'; }); log.on('mouseover', function() { this.style.color = (this.style.color == 'blue' ? 'green' : 'blue'); log.innerHTML = 'log div hovered!'; });
}); // DOMContentLoaded
// Replicate the .on() event handling function:
Object.prototype.on = function(event, customFunction) { if( this.length > 0 ) { for( i=0; i<this.length; i++ ) { if ( this[i].addEventListener ) { this[i].addEventListener(event, customFunction, false); } else if ( this[i].attachEvent ) { this[i].attachEvent('on' + event, customFunction); } } } else { if ( this.addEventListener ) { this.addEventListener(event, customFunction, false); } else if ( this.attachEvent ) { this.attachEvent('on' + event, customFunction); } }
}
.on() event handling in JavaScript (jQuery-like) - Script Codes
.on() event handling in JavaScript (jQuery-like) - Script Codes
Home Page Home
Developer Jelmer
Username jelmerdemaat
Uploaded December 02, 2022
Rating 3
Size 2,514 Kb
Views 12,144
Do you need developer help for .on() event handling in JavaScript (jQuery-like)?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Jelmer (jelmerdemaat) Script Codes
Name
Justified divs, attempt 2
CSS grid system using justify
Justified divs, attempt 4
Ruler CSS gradient background pattern
Test current page in Google PageSpeed
Check comment length to filter unuseful ones
Get Gist comments using GitHub API
A pure CSS slideshow
Replaced content cannot have pseudo elements
Loading spinner moving bars
Create amazing art & images with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!