Kalkulator html/js nie dziala

Jest ktos kto jest w stanie stwierdzić gdzie lezy problem? Nie wiem czemu to się ze sobą nie łączy.

Tutaj html:

<form>Liczba1<input type="number" id="Liczba1"></form>
        <form>Liczba2<input type="number" id="Liczba2"></form>

        <button onclick="rezultat()">Dodawanie</button>
        <button onclick="rezultat()">Odejmowanie</button>
        <button onclick="rezultat()">Mnozenie</button>
        <button onclick="rezultat()">Dzielenie</button>
                  
          <h1><span id = "wynik">wynik</span></h1> 

Tutaj JavaScript:

function rezultat() {
    document.getElementById("wynik").innerHTML="test";
}


var a = document.getElementById("a").value
var b = document.getElementById("b").value
a=Number(a);
b=Number(b);
var suma=a+b;
document.getElementsById("wynik")innerHTML="test";

Muszę zacznijmy od tego: document.getElementById("a").

Odwołujesz się do elementu o ID "a", ale w poddanym fragmencie HTML go (tego elementu) nie pokazałeś. Czy on w ogóle istnieje? Jeśli tak, to go nam pokaż.

Kolejne rzeczy jakie rzucają się w oczy to dwa formularze, każdy na jeden element. Formularz ma być zbiorem potrzebnych dalej elementów. To sprawdzenie wartosci a i b masz poza funkcją rezult i może nigdy tam Twój program nie dojdzie.

@cerrato: Naprawilem troche kod wiec po wprowadzeniu liczb i kliknieciu przycisku naglowek H1 "wynik" zmienia sie na "test".
I właśnie jak zrobić żeby zamiast tego testu wyświetlał sie prawdziwy wynik.
Tutaj html:

        <form>Liczba1<input type="number" id="Liczba1"></form>
        <form>Liczba2<input type="number" id="Liczba2"></form>

        <button onclick="rezultat()">Dodawanie</button>
        <button onclick="rezultat()">Odejmowanie</button>
        <button onclick="rezultat()">Mnozenie</button>
        <button onclick="rezultat()">Dzielenie</button>
                  
          <h1><span id = "wynik">wynik</span></h1>    

A tu js

function rezultat() {
    document.getElementById("wynik").innerHTML="test";



var a = document.getElementById("a").value;
var b = document.getElementById("b").value;
a=Number(a);
b=Number(b);
var suma=a+b;
document.getElementsById("wynik").innerHTML="test";
}

Chyba nadal się nie rozumiemy :(

Zobacz - fragment document.getElementById("a").value; odwołuje się do elementu w HTML, który posiada ID o wartości "a". Ale w podanym HTML nie widzę niczego takiego, jedynie masz id="Liczba1" oraz id="Liczba2". Żadne z nich nie ma wartości id="a", więc nie wiemy, co sobie pobierasz.

Poza tym @jurek1980 zwrócił uwagę na to, że masz dwa elementy <form> ... </form>. Czemu masz to rozbite na dwa formularze, zamiast zamknąć to w jednym?

Kolejna sprawa - masz 4 przyciski, z czego każdy odpowiada za inne działanie. I każdy z nich wywołuje tą samą funkcję o nazwie function rezultat(). Skąd funkcja ma wiedzieć, jakie działanie ma wykonać?