<button id="customEventButton">Trigger Custom Event</button>
<script>
// Creating a custom event
const myEvent = new CustomEvent('myCustomEvent', {
detail: { message: 'Custom event triggered' }
});
// Event listener for custom event
document.addEventListener('myCustomEvent', function(event) {
alert('Event Message: ' + event.detail.message);
});
// Dispatch the custom event when button is clicked
document.getElementById('customEventButton').addEventListener('click', function() {
document.dispatchEvent(myEvent);
});
</script>