Implement copy-on-click using JavaScript
In this article, we learn how to copy content on particular div means using div id. “Copy div innerhtml to clipboard JavaScript”
Source Code:-
<fieldset style="width:350px;">
<legend>Copy div innerhtml to clipboard JavaScript
</legend>
<div id="divcopyid">
<h3>Our greatest weakness lies in giving up. The most
certain way to succeed is
always
to try just one more time.</h3>
</div>
<a href="#" id="copy" onclick="copyText()">Copy</a>
</fieldset>
JavaScript:
<script type="text/javascript">
function copyText() {
let diva =
document.getElementById('copy');
diva.innerText = "Copied";
let div =
document.getElementById('divcopyid');
let text =
div.innerText;
let textArea =
document.createElement('textarea');
textArea.width = "1px";
textArea.height = "1px";
textArea.background = "transparents";
textArea.value = text;
document.body.append(textArea);
textArea.select();
document.execCommand('copy');
document.body.removeChild(textArea);
}
</script>
Out-Put:
![Implement copy-on-click using JavaScript](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjr_2dcK-ynLzZdAy5aKLv6yQLNrTKv2ZqgEOSHQIwirrwOHPMrpMXd_FMe6JaW9RYxi_vSs64y1yrmeLFoyZ4pF5cZJVWP26bq_HbdLfQWy1EBGiJ5BhzRJ_Wo3BZtD98Nl8dTi8Ds9PH58bRJnd6ZKe6Pt5CH5mF6qCCDD3B3ZKWy0PECc_Hv0Pyz/s72-w640-c-h294/Copy%20div%20innerhtml%20to%20clipboard%20JavaScript.gif)
No comments: