Task using Selecting Elements in Dom
Task 1
Find the count of h2 tags using Dom by click Event via ID
<!DOCTYPE html>
<html>
<head>
<script>
function demo()
{
let btn = document.getElementById('btnCount');
let headings = document.getElementsByTagName('h2');
alert("The number of H2 tags =" +headings.length);
}
</script>
</head>
<body>
<h2>First heading</h2>
<h2>Second heading</h2>
<h2>Third heading</h2>
<button id="btnCount" onclick=demo();>Count H2</button>
</body>
</html>
Task2
Create a gender form with name. with the help of dom find the selected value of gender
<!DOCTYPE html>
<html>
<head></head>
<body>
<h1>Please select the Gender:</h1>
<input type="radio" name="gender" value="Male"> Male
<input type="radio" name="gender" value="Female"> Female
<br><br>
<button id="demo" onclick="demo();">Submit</button>
<script>
function demo()
{
let btn = document.getElementById('demo');
genders = document.getElementsByName('gender');
for(var i=0;i<=genders.length;i++)
{
if (genders[i].checked) {
alert("You selected: "+genders[i].value);
}
}
}
</script>
</body>
</html>