Como obter as coordenadas X e Y de um elemento HTML na página?
Olá a todos! Sou novo em JavaScript e em desenvolvimento web em geral. Tenho um problema: preciso saber a posição exata (coordenadas X e Y) de um elemento HTML em relação ao documento (página inteira), para, por exemplo, posicionar dinamicamente uma tooltip (dica de ferramenta) ao lado desse elemento.
Tentei usar as propriedades `offsetLeft` e `offsetTop`, mas elas parecem dar a posição apenas em relação ao contêiner pai (`offsetParent`), e não à página inteira. Se o elemento estiver aninhado profundamente em vários `
` com diferentes `position`, as coordenadas ficam incorretas.
Aqui está um exemplo do meu código:
```html
```
```javascript
const button = document.getElementById('myButton');
const x = button.offsetLeft; // Retorna 20 (relativo a inner, não à página)