javascript當(dāng)中attributes的用法
馬克- to-win:馬克 java社區(qū):防盜版實(shí)名手機(jī)尾號: 73203。
例 3.1(getElementsByNameNodeListAttributeIEFF.html)
<HTML>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
</HEAD>
<BODY>
<DIV ID="RESULT"></DIV>
<FORM onClick="handleClick(event)">
<INPUT TYPE="checkbox" VALUE="A" NAME="BOX" id="BOX_A" checked="true">Selection A<BR>
<INPUT TYPE="checkbox" VALUE="B" NAME="BOX" id="BOX_B">Selection B<BR>
<INPUT TYPE="checkbox" VALUE="C" NAME="BOX" id="BOX_C">Selection C<BR>
<INPUT TYPE="checkbox" VALUE="D" NAME="BOX" id="BOX_D">Selection D<BR>
</FORM>
<SCRIPT>
function handleClick(event)
{
myString='';
/* because there is no this method of getElementsByID, ID is unique
Document.getElementsByName() (Method)
An accessor method for retrieving objects from within the DOM hierarchy specifically according to their NAME value.
Property/method value type: NodeList object
JavaScript syntax: - myDocument.getElementsByName(aName)
Argument list: aName The name of the element to be retrieved
*/
/*馬克-to-win:event.target是最上層的元素,注意這里點(diǎn)擊時(shí),一定得點(diǎn)中方格里,如果點(diǎn)在方格外面,則event.target.id 是空值。*/
var event = event||window.event;
var eSource =event.srcElement||event.target;
nodeListBox=document.getElementsByName("BOX");
/*Element.attributes[] (Collection)
A reference to a collection of attribute objects for the HTML tag that the Element object represents.
Property/method value type: Attributes object
nodeListBox[1].attributes['value']是第一個元素的眾多屬性當(dāng)中的 VALUE="B" 這個屬性。,
nodeListBox[1].attributes['value'].name是Value,
nodeListBox[1].attributes['value'].value是B
*/
alert("nodeListBox.length is"+ nodeListBox.length);
myString ="nodeListBox[1] attribute "+nodeListBox[1].attributes['value'].name
+" is "+nodeListBox[1].attributes['value'].value+" attribute "+nodeListBox[1].attributes['id'].name+" is "+nodeListBox[1].attributes['id'].value;
alert(myString);
/*refer to event bubble, event.target.id is always the most inner one*/
myString = "event.target.id is "+ eSource.id+" event.target.value ";
myString += eSource.value;
myString += "event.target.checked is";
myString += eSource.checked;
alert(myString);
document.all.RESULT.innerHTML = "this is test for document.all.RESULT.innerHTML ";
/*馬克-to-win:下面兩句話配合起來非常重要,這樣既使不知道id是多少,也可以獲得元素*/
var str=nodeListBox[3].attributes['id'].value;
var input3 = document.getElementById(str);
alert("nodeListBox[3].checked is"+input3.checked);
// alert("selection is"+document.selection.createRange().text);
}
</SCRIPT>
</BODY>
</HTML>