HTML DOM Output name Property
Last Updated :
15 Jun, 2023
The Output name Property in HTML DOM is used to set or return the value of the name Attribute of an <output> element. The name Attribute is used to reference the form-data after submitting the form or to reference the element in JavaScript.
Syntax:
- It returns the name property.
outputObject.name
- It set the name property.
outputObject.name = name
Property value: It contains the value name Which specifies the name of the Output Element.
Return value: It returns a string value that specifies the name of the Output Element.
Example 1: This Example returns an Output name Property.
HTML
<!DOCTYPE html>
<html>
<head>
<title>
HTML DOM Output name Property
</title>
<style>
body {
text-align: center;
}
h1 {
color: green;
}
</style>
</head>
<body>
<h1>GeeksforGeeks</h1>
<h4>
HTML DOM Output name Property
</h4>
<form oninput="sumresult.value = parseInt(A.value)
+ parseInt(B.value) + parseInt(C.value)">
<input type="number" name="A" value="50" /> +
<input type="range" name="B" value="0" /> +
<input type="number" name="C" value="50" />
<br /> Submit Result:
<output name="sumresult" id="geeks" for="A B C">
</output>
<br>
<br>
</form>
<Button onclick="myGeeks()">Submit</Button>
<h2 id="sudo"></h2>
<script>
function myGeeks() {
let x = document.getElementById("geeks").name;
document.getElementById("sudo").innerHTML = x;
}
</script>
</body>
</html>
|
Output:
Example 2: This Example sets the Output name Property.
HTML
<!DOCTYPE html>
<html>
<head>
<title>
HTML DOM Output name Property
</title>
<style>
body {
text-align: center;
}
h1 {
color: green;
}
</style>
</head>
<body>
<h1>GeeksforGeeks</h1>
<h4>
HTML DOM Output name Property
</h4>
<form oninput="sumresult.value = parseInt(A.value)
+ parseInt(B.value) + parseInt(C.value)">
<input type="number" name="A" value="50" /> +
<input type="range" name="B" value="0" /> +
<input type="number" name="C" value="50" />
<br /> Submit Result:
<output name="sumresult" id="geeks" for="A B C">
</output>
<br>
<br>
</form>
<Button onclick="myGeeks()">Submit</Button>
<h2 id="sudo"></h2>
<script>
function myGeeks() {
let x = document.getElementById("geeks").name =
"Total result";
document.getElementById("sudo").innerHTML =
"The name was changed to " + x;
}
</script>
</body>
</html>
|
Output:
Supported Browsers: The browsers supported by HTML DOM Output name Property are listed below:
- Google Chrome 10.0
- Firefox 4.0
- Opera 11.0
- Safari 5.1
Like Article
Suggest improvement
Share your thoughts in the comments
Please Login to comment...