HTML
Addition of two numbers using output tag |HTML|
Introduction
HTML (HyperText Markup Language) is the backbone of the web, providing the structure for web pages. While it's primarily used for displaying content, HTML also supports interactive elements through its attributes and events.
Code
<html>
<head>
<title>Output</title>
</head>
<body>
<form oninput="result.value=parseInt(first.value)+parseInt(second.value)">
<input name="first" type="number"> +
<input name="second" type="number"> =
<output name="result" for="first second"></output>
</form>
</body>
</html>
In this code, we have a simple form with two input fields for entering numbers. The oninput attribute in the <form> tag triggers a JavaScript expression whenever the input values change. its working steps are follows
- We use the `parseInt()` function to convert the input values from strings to integers.
- The JavaScript expression inside the `oninput` attribute calculates the sum of the two numbers and assigns it to the result output field.
- The for attribute in the `<output>` tag specifies which input fields the output is associated with.
Output
Conclusion
In conclusion, HTML isn't limited to just displaying static content; it can also handle basic interactivity and calculations. By leveraging HTML's capabilities along with minimal JavaScript, you can create engaging and efficient user interfaces without relying on external libraries or frameworks.
Post a Comment
0 Comments