Help
Options
Didn't know it?
click below
click below
Knew it?
click below
click below
Don't Know
Remaining cards (0)
Know
retry
shuffle
restart
0:00
Embed Code - If you would like this activity on your web page, copy the script below and paste it into your web page.
Normal Size Small Size show me how
Normal Size Small Size show me how
JS - Week 3
WTWD 310 - JavaScript
| Term | Definition | Example |
|---|---|---|
| Event | An action or occurrence that happens in the browser such as a click a keypress or a page load which can be detected and handled using JavaScript. | document.addEventListener('click', function() { console.log('Element clicked'); }); |
| Event Listener | A function that waits for a specified event to occur on a particular element and then executes a defined callback function. | let button = document.getElementById('myButton'); button.addEventListener('click', function() { alert('Button was clicked!'); }); |
| Click Event | An event that occurs when an element is clicked by the user. | let button = document.getElementById('myButton'); button.addEventListener('click', function() { console.log('Button clicked'); }); |
| Mouseover Event | An event that occurs when the mouse pointer is moved onto an element. | let element = document.getElementById('hoverElement'); element.addEventListener('mouseover', function() { element.style.backgroundColor = 'yellow'; }); |
| Keypress Event | An event that occurs when a key is pressed down on the keyboard. | document.addEventListener('keypress', function(event) { console.log('Key pressed: ' + event.key); }); |
| Form Validation | The process of checking user input in forms to ensure that it is in the correct format and meets the required criteria before submission. | let form = document.getElementById('myForm'); form.addEventListener('submit', function(event) { let email = document.getElementById('email').value; if (!email.includes('@')) { event.preventDefault(); alert('Please enter a valid email address'); } }); |
| Prevent Default | A method used to prevent the default behavior of an event such as preventing a form from submitting. | let link = document.getElementById('myLink'); link.addEventListener('click', function(event) { event.preventDefault(); console.log('Link click prevented'); }); |
| Event Object | An object that contains information about an event such as the type of event and the element that triggered it. | document.addEventListener('click', function(event) { console.log('Event type: ' + event.type); console.log('Element: ' + event.target); }); |
| Dynamic Content | Content that can change in response to user interactions or other events often updated using JavaScript. | let button = document.getElementById('updateButton'); button.addEventListener('click', function() { document.getElementById('content').innerText = 'Content updated!'; }); |
| Feedback Mechanism | Methods used to provide feedback to the user based on their interactions such as displaying error messages or confirmation dialogs. | let x = document.getElementById('name'), y = document.getElementById('feedback'); x.addEventListener('x', function() { y.innerText = x.value.length < 5 ? 'Invalid: Over 5 chars' : 'Valid'; y.style.color = x.value.length < 5 ? 'red' : 'green'; }); |
| Interactive Web Elements | Elements on a web page that respond to user interactions enhancing the user experience through interactivity. | let button = document.createElement('button'); button.innerText = 'Click me'; button.addEventListener('click', function() { alert('Button was clicked!'); }); document.body.appendChild(button); |
Created by:
ProfJordan
Popular Computers sets