chaorace/example-iframe.html Secret

## example-iframe.html
<html>
    <body>
        <button type="button" onclick="clicked(this)">IFrame Button</button>
        <div id="shadow-root"></div>
        <script>
         function clicked(element){ element.innerHTML = 'Clicked' }
         const shadow = document.getElementById('shadow-root').attachShadow({ mode: 'open' })
         const shadowButton = document.createElement('button')
         shadowButton.type = 'button"'
         shadowButton.innerHTML = 'IFrame Shadow Button'
         shadowButton.onclick = function(){ clicked(this) }
         shadow.appendChild(shadowButton)
        </script>
    </body>
</html>

## example.html
<html>
    <body>
        <button type="button" onclick="clicked(this)">Normal Button</button>
        <div id="shadow-root"></div>
        <script>
         function clicked(element){ element.innerHTML = 'Clicked' }
         const shadow = document.getElementById('shadow-root').attachShadow({ mode: 'open' })
         const shadowButton = document.createElement('button')
         shadowButton.type = 'button'
         shadowButton.innerHTML = 'Shadow Button'
         shadowButton.onclick = function(){ clicked(this) }
         shadow.appendChild(shadowButton)
        </script>
        <iframe src="./example-iframe.html">
    </body>
</html>
	<html>
	<body>
	<button type="button" onclick="clicked(this)">IFrame Button</button>
	<div id="shadow-root"></div>
	<script>
	function clicked(element){ element.innerHTML = 'Clicked' }
	const shadow = document.getElementById('shadow-root').attachShadow({ mode: 'open' })
	const shadowButton = document.createElement('button')
	shadowButton.type = 'button"'
	shadowButton.innerHTML = 'IFrame Shadow Button'
	shadowButton.onclick = function(){ clicked(this) }
	shadow.appendChild(shadowButton)
	</script>
	</body>
	</html>