点击屏幕新增一个按钮/图片等控件

在日常代码编写中，有时候会遇到一些在页面中随机点击新增一个按钮，图片等控件或文字，此时我们需要用到如下代码
代码如下
html:

js:
1.先设置图片
var img = $('');
img.attr('ID', 'myCarousels123'); // 设置图片源
img.attr('src', '/GateMana/FindImage?GateID=' + obj.gateID); // 设置图片源
$('.TemplateImg').append(img); // 将图片添加到body中

2.获取点击的X，Y轴数据，并且生成对应控件
const element = document.getElementById('myCarousels123'); //获取当前背景，用来定位
const rect = element.getBoundingClientRect();
const width = rect.width; //宽
const height = rect.height; //高
const xPercentage = (event.clientX - rect.left) / width * 100; //定位计算可按照自身需求经行修改
const yPercentage = (event.clientY - rect.top) / height * 100;
var btn = document.createElement('button'); //生成按钮button
btn样式绑定，可按照需求设定
$('.TemplateImg').append(btn); //生成控件