如何使用javascript查找div顶部中心的坐标？

我有一个像下面这样的div，

如果我使用getBoundingClientRect（）方法有上、左、下、右、x、y值，如何获得该div的（x1，y1）和（x2，y2）坐标，如图所示

我试过下面的方法

for x1, y1
    return {x: (rect.left + rect.width / 2), y: rect.top + (rect.height / 2)};

for  x2, y2
    return {x: rect.right, y:rect.top + (rect.height / 2)};

---

有人能帮我吗。谢谢。

您可以这样做：

const circle1=document.querySelector（'c1'）；
const circle2=document.querySelector（'#c2'）；
const-box=document.querySelector（'.box'）；
const rect=box.getBoundingClientRect（）；
常数topCenter={
x:rect.x+rect.width/2，
y:rect.y，
}
常数中心右={
x:rect.x+rect.width，
y:rect.y+rect.height/2，
}
常数circleRadius=5；
circle1.style.left=`${topCenter.x-circleRadius}px`；
circle1.style.top=`${topCenter.y-circleRadius}px`；
circle2.style.left=`${centerRight.x-circleRadius}px`；
circle2.style.top=`${centerRight.y-circleRadius}px`
*{
填充：0；
保证金：0；
}
身体{
位置：相对位置；
宽度：100vw；
高度：100vh；
}
.盒子{
--高度：100px；
--宽度：200px；
位置：绝对位置；
左：计算（（100%-var（--宽度））/2）；
顶部：计算（（100%-变量（--高度））/2）；
宽度：var（--宽度）；
高度：var（--高度）；
边框：1px纯黑；
}
.圆圈{
位置：绝对位置；
边界半径：50%；
背景：红色；
宽度：10px；
高度：10px；
}

显示的div是否有静态宽度？是，但没有静态高度。我的最小高度为62。提供给这些问题的所有答案都与此问题无关@SamWalpole