Events(4)
버블링과 캡처링
const parentEl = document.querySelector('.parent')
const childEl = document.querySelector('.child')
const anchorEl = document.querySelector('a')
window.addEventListener('click', event => {
console.log('Window!')
})
document.body.addEventListener('click', event => {
console.log('Body!')
})
parentEl.addEventListener('click', event => {
console.log('parent!')
event.stopPropagation()
})
childEl.addEventListener('click', event => {
console.log('child!')
})
anchorEl.addEventListener('click', event => {
console.log('Anchor!')
})
const parentEl = document.querySelector('.parent')
const childEl = document.querySelector('.child')
const anchorEl = document.querySelector('a')
window.addEventListener('click', event => {
console.log('Window!')
})
document.body.addEventListener('click', event => {
console.log('Body!')
}, {capture: true})
parentEl.addEventListener('click', event => {
console.log('parent!')
})
childEl.addEventListener('click', event => {
console.log('child!')
})
anchorEl.addEventListener('click', event => {
console.log('Anchor!')
})