m3g4p0p · July 30, 2020 18:15
diff --git a/inner.html b/inner.html
 <!DOCTYPE html>
 <html lang="en">
 <head>
  <meta charset="UTF-8">
  <title>Inner</title>
 </head>
 <body>
  <a href="#" id="my-link">Click me</a>
 </body>
 </html>
diff --git a/main.js b/main.js
 const message = document.getElementById('message')
 const iframe = document.getElementById('my-iframe')

 function displayEvent (event) {
  message.textContent = event.type
 }

 iframe.contentWindow.addEventListener('load', () => {
  const link = iframe.contentDocument.getElementById('my-link')

  link.addEventListener('mouseover', displayEvent)
  link.addEventListener('mouseout', displayEvent)
  link.addEventListener('click', displayEvent)
 })
diff --git a/outer.html b/outer.html
 <!DOCTYPE html>
 <html lang="en">
 <head>
  <meta charset="UTF-8">
  <title>Outer</title>
 </head>
 <body>
  <p id="message">&nbsp;</p>
  <iframe src="inner.html" id="my-iframe"></iframe>
  <script src="main.js"></script>
 </body>
 </html>
	const message = document.getElementById('message')
	const iframe = document.getElementById('my-iframe')

	function displayEvent (event) {
	message.textContent = event.type
	}

	iframe.contentWindow.addEventListener('load', () => {
	const link = iframe.contentDocument.getElementById('my-link')

	link.addEventListener('mouseover', displayEvent)
	link.addEventListener('mouseout', displayEvent)
	link.addEventListener('click', displayEvent)
	})