Geolocation API

if ("geolocation" in navigator) {
  /*   */
} else {
  /*    */
}

navigator.geolocation.getCurrentPosition(function (position) {
  do_something(position.coords.latitude, position.coords.longitude);
});

var watchID = navigator.geolocation.watchPosition(function (position) {
  do_something(position.coords.latitude, position.coords.longitude);
});

navigator.geolocation.clearWatch(watchID);

function geo_success(position) {
  do_something(position.coords.latitude, position.coords.longitude);
}

function geo_error() {
  alert(",   .");
}

var geo_options = {
  enableHighAccuracy: true,
  maximumAge: 30000,
  timeout: 27000,
};

var wpid = navigator.geolocation.watchPosition(
  geo_success,
  geo_error,
  geo_options,
);

function success(position) {
  const latitude = position.coords.latitude;
  const longitude = position.coords.longitude;

  //  ,  -   (latitude)  (longitude)
}

function errorCallback(error) {
  alert("ERROR(" + error.code + "): " + error.message);
}

body {
  padding: 20px;
  background-color: #ffffc9;
}

button {
  margin: 0.5rem 0;
}

<button id="find-me">Show my location</button><br />
<p id="status"></p>
<a id="map-link" target="_blank"></a>

function geoFindMe() {
  const status = document.querySelector("#status");
  const mapLink = document.querySelector("#map-link");

  mapLink.href = "";
  mapLink.textContent = "";

  function success(position) {
    const latitude = position.coords.latitude;
    const longitude = position.coords.longitude;

    status.textContent = "";
    mapLink.href = `https://www.openstreetmap.org/#map=18/${latitude}/${longitude}`;
    mapLink.textContent = `: ${latitude} , : ${longitude} `;
  }

  function error() {
    status.textContent = "   ";
  }

  if (!navigator.geolocation) {
    status.textContent = "Geolocation    ";
  } else {
    status.textContent = " ";
    navigator.geolocation.getCurrentPosition(success, error);
  }
}

document.querySelector("#find-me").addEventListener("click", geoFindMe);