To retrieve the value from a function, you must access it within the function:
function start() {
var g = document.getElementById("al").value;
document.getElementById("test2").innerHTML = typeof(g) + parseFloat(g);
}
<p id="test2">Output is displayed here:</p>
<form>
<label for="g">a:</label>
<input type="number" id="al" name="g" placeholder="Enter a" value="55">
<button onclick="start()" type="button">Click Here</button>
</form>
Note: Using inline HTML on* handlers is considered poor programming practice. It can be difficult to debug. JavaScript should ideally be in one centralized location. Instead, consider using Element.addEventListener().
const elBtn = document.querySelector("#start");
const elTest = document.querySelector("#test2");
const elG = document.querySelector("[name=g]");
const printGValue = () => {
const g = elG.value;
elTest.textContent = typeof(g) + parseFloat(g);
};
// Execute on click
elBtn.addEventListener("click", printGValue);
// Also execute on initialization:
printGValue();
<form>
<label>a: <input type="number" name="g" placeholder="Enter a" value="55"></label>
<button id="start" type="button">Click Here</button>
</form>
<p id="test2"></p>