<!DOCTYPE html>
<html>
<head>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<h1>Random Stuff</h1>
<script>
import fetch from "node-fetch";
function getweather(){
fetch('http://api.weatherapi.com/v1/current.json?key=f085cc2632a24b64965195959210710&q=84065&aqi=no')
.then(response => response.json())
.then(data => {
const weather = data.current.temp_f;
setweather(weather);
})
}
function setweather(weather) {
console.log(weather)
document.getElementById("temp").innerHTML = weather;
}
</script>
<input type="number" placeholder="Type something..." id="myInput", pattern="[0-9]*">
<button type="button" onclick="getweather()">Get Value</button>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</body>
<button onclick="getweather()", id="id">Click me</button>
<h1>The weather is:</h1>
<h2 id="temp"></h2>
</html>
Here I have my HTML file and whenever I click a button I get the error (in the title) I have been trying to find out why this isn't working, I have just started HTML, CSS, and JS the answer may be obvious but I cant seem to fix it.