临时页面JS复制用-优快云博客

本文链接：https://blog.youkuaiyun.com/Baiychenvip/article/details/121245317

这段代码展示了如何通过创建并附加两个JavaScript脚本来实现页面上元素的代码复制功能。当鼠标悬停在ID为'content'和'css'的元素上时，脚本会自动创建ClipboardJS实例，用于复制对应元素的值。成功复制和错误处理都进行了监听和日志记录。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

var sj = document.createElement('script');
sj.src = 'https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js';
document.body.appendChild(sj);
var sj2 = document.createElement('script');
sj2.src = 'https://cdn.bootcdn.net/ajax/libs/clipboard.js/2.0.8/clipboard.js';
sj2.onload = function(){
   var id = '#content';
       $(document).on('mouseover', id, function(){
           console.log('onmouseover')
           if($(id).attr('clipboard') != 1){
               $(id).attr('clipboard', 1)
               var txobj = document.getElementById(id.replace('#', ''));
               var clipboard = new ClipboardJS(txobj, {
                   text: () => txobj.value
               })
               clipboard.on('success', function(e) {
           console.log(e);
           });
           clipboard.on('error', function(e) {
           console.log(e);
           });
           }
       })

   var id2 = '#css';
       $(document).on('mouseover', id2, function(){
           console.log('onmouseover')
           if($(id2).attr('clipboard') != 1){
               $(id2).attr('clipboard', 1)
               var txobj = document.getElementById(id2.replace('#', ''));
               var clipboard = new ClipboardJS(txobj, {
                   text: () => txobj.value
               })
               clipboard.on('success', function(e) {
           console.log(e);
           });
           clipboard.on('error', function(e) {
           console.log(e);
           });
           }
       })
}
document.body.appendChild(sj2);