我写了JS来克隆图像，并将此操作附加到button。
这是可行的，但我不确定这样做是否更好。
我的问题：
使用querySelector返回元素是正确的，还是为按钮和图片添加其他类或id更好？
在这种情况下，使用cloneNode是最佳的还是更好地使用其他方法？
(function() {
'use strict';
document.querySelector('button[action="button"]').addEventListener('click', function() {
let image = document.querySelector('img[alt="Dog"]');
let cln = image.cloneNode(true);
document.getElementById('image-section').appendChild(cln);
});
})();<body>
<div id="overview">
<section class="section--center">
<button action="button">Yeah, I want more dogs!</button>
</section>
<section class="section--center" id='image-section'>
<img src="https://www.purina.com/sites/g/files/auxxlc196/files/styles/kraken_generic_max_width_480/public/HOUND_Beagle-%2813inch%29.jpg?itok=lN915WHC" alt="Dog" style="width: 150px">
</section>
</div>
</body>最佳答案
另一个选择是更新innerHTML，但不是更好。
一种方法应该解决一个任务，所以它取决于任务。
(function() {
'use strict';
document.querySelector('button[action="button"]').addEventListener('click', function() {
document.getElementById('image-section').innerHTML +=
document.querySelector('img[alt="Dog"]').outerHTML;
});
})();<body>
<div id="overview">
<section class="section--center">
<button action="button">Yeah, I want more dogs!</button>
</section>
<section class="section--center" id='image-section'>
<img src="https://www.purina.com/sites/g/files/auxxlc196/files/styles/kraken_generic_max_width_480/public/HOUND_Beagle-%2813inch%29.jpg?itok=lN915WHC" alt="Dog" style="width: 150px">
</section>
</div>
</body>关于javascript - 如何在纯js中克隆图像，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/51063923/