代码
提交代码
<style> .box { display: flex; justify-content: center; align-items: center; } .ele1 { background: wheat; width: 200px; height: 200px; } .ele2 { background: yellowgreen; width: 100px; height: 100px; } </style> <div class="box ele1"> <div class="box ele2"></div> </div> <div class="result"></div> <script> var ele1 = document.querySelector('.ele1'); var ele2 = document.querySelector('.ele2'); var result = document.querySelector('.result'); function getElement(content) { var el = document.createElement('p'); el.innerText = content; return el; } ele1.addEventListener('click', function() { result.appendChild(getElement('我是元素ele1')); }); ele2.addEventListener('click', function() { result.appendChild(getElement('我是元素ele2')); }); </script>
运行结果