實現：點擊圖片實現 鼠標改變
實現思想：
首先創建n+1個圖片標籤，+1是一個沒有地址的img標籤，爲了後期動態添加圖片地址的。
選擇點擊哪個圖片，就獲取到哪個的src地址，動態賦給空的img，再根據 e.clientX和 e.clientY獲取鼠標的位置，再爲空img設置會位置，實現代碼如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>鼠標指針圖標</title>
<style>
*{margin:0px;padding:0px;}
div{
padding: 12px;
margin-top: 12px
}
.imgs{
position: relative;
}
img{
position: absolute;
}
img{
/* position: absolute;*/
width: 36px
}
.left{
float: right;
padding-bottom: 30px:
}
.ulStyle{list-style: none;}
.ulStyle li{background-color:white;list-style:none;}
</style>
</head>
<body class="text-white">
<div class="left">
<ul class="ulStyle css">
<li><img class="imgs" src="https://i0.hdslb.com/bfs/emote/f8cdabfc1b81fd25b85b8457ee49a20a4fc5d91b.png@100w_100h.webp" οnclick="imgCopy()"></li>
<li><img class="imgs" src="https://i0.hdslb.com/bfs/emote/89712c0d4af73e67f89e35cbc518420380a7f6f4.png@100w_100h.webp" οnclick="imgCopy()"></a></li>
<li> <img class="imgs" src="https://i0.hdslb.com/bfs/emote/142409b595982b8210b2958f3d340f3b47942645.png@100w_100h.webp" οnclick="imgCopy()"></li>
<img id="question" src="">
</ul>
</div>
<script>
//let img=document.querySelector('img');
let imgs=document.querySelectorAll('img');
document.addEventListener('mousemove',function(e){
let x=e.clientX;
let y=e.clientY;
})
function imgCopy(){
}
for(var i=0;i<imgs.length;i++){
imgs[i].οnclick=function(){
let img = document.getElementById("question");
console.log(this.src);
img.src=this.src;
}
}
document.addEventListener('mousemove',function(e){
let x=e.clientX;
let y=e.clientY;
document.getElementById("question").style.top=y+10+"px";
document.getElementById("question").style.left=x+10+"px";
})
</script>
</body>
</html>