To do something interesting
with HTML elements, we must first be able to uniquely identify which element we
want. In the example
<body>
<form
action="">
<input
type="button" id="useless" name="mybutton"
value="doNothing" />
</form>
</body>
We can use the
"getElementById" method (which is generally preferred)
document.getElementById("useless").style.color
= "red";
or we can use the older
hierarchical navigation method,
document.forms[0].mybutton.style.color
= "blue";
Notice that this uses the
"name" attribute of the element to locate it.
# Example of Accessing
Elements in a DOM.
<script
type="text/javascript" >
function showStatus() {
var selectWidget =
document.forms.beerForm.elements["beer"];
var myValue =
selectWidget.options[selectWidget.selectedIndex].value;
alert('You drank a \"'+
myValue +"\"");
return true;
}
</script>
<form
name="beerForm" action="">
<select
name="beer">
<option
selected="selected">Select Beer</option>
<option>Heineken</option>
<option>Amstel
Light</option>
<option>Corona</option>
<option>Corona
Light</option>
<option>Tecate</option>
</select>
<input
type="button" name="submitbutton" value="Drink"
onclick="showStatus()"
/>
</form>
No comments:
Post a Comment