<!DOCTYPE html>
<html>
<head>
<title>Geolocation API</title>
</head>
<body>
<button onclick="getLocation()">Get Your Coordinates</button>
<p id="coords"></p>
<script>
const x = document.getElementById("coords");
// The getCurrentPosition() method is used to get the current position of the device.
// The try/catch combo handles errors without stopping JavaScript.
// The try statement defines the code block to run (to try).
// The catch statement defines a code block to handle any error.
function getLocation() {
try {
navigator.geolocation.getCurrentPosition(showPosition);
} catch {
x.innerHTML = "Geolocation Error!";}}
function showPosition(position) {
x.innerHTML = "Latitude: " + position.coords.latitude +
"<br>Longitude: " + position.coords.longitude;}
</script>
</body>
</body>
</html>
