February 3, 2001 - Reading an Attribute Node | WebReference

February 3, 2001 - Reading an Attribute Node

Yehuda Shiran February 3, 2001
Reading an Attribute Node
Tips: February 2001

Yehuda Shiran, Ph.D.
Doc JavaScript

Unlike Internet Explorer that supports only setAttribute() and getAttribute(), Netscape 6 supports also setAttributeNode() and getAttributeNode(). The getAttributeNode() extracts the value of the attribute object. Here is the syntax:

elementNode.getAttributeNode(attributeName).value;
where:

elementNode is a tag node. It mush have been created with the createElement() method.
  • attributeName is the attribute name used in the createAttribute() method.

    Here is a sample code which first creates an object, nodePublishDate, that is equal to today's date. It then creates a tag element node ("P"), and finally converts this latter node to an attribute node:

    var nodeBook, nodePublishDate;
nodePublishDate = document.createAttribute("PublishDate");
nodePublishDate.value = String(Date());
nodeBook = document.createElement("P");
nodeBook.setAttributeNode(nodePublishDate);

    We put it in a conditional statement in the header of this tip:

    NS6 = false;
if (document.all) {}
else if (document.getElementById) {
  NS6 = true;
  var nodeBook, nodePublishDate;
  nodePublishDate = document.createAttribute("PublishDate");
  nodePublishDate.value = String(Date());
  nodeBook = document.createElement("P");
  nodeBook.setAttributeNode(nodePublishDate);
}

    Click the following buttons to see that indeed nodeBook is an attribute node. The name of the attribute is PublishDate and its value is today's date:

    Here is how we define the buttons above:

    <FORM>
<INPUT TYPE="button" VALUE="getAttribute('PublishDate')" 
onClick="javascript:if (NS6) {alert(nodeBook.getAttribute('PublishDate'))} 
else {alert('You must use Netscape 6')}">
<INPUT TYPE="button" VALUE="getAttributeNode('PublishDate').value" 
onClick="javascript:if (NS6) {alert(nodeBook.getAttributeNode('PublishDate').value)} 
else {alert('You must use Netscape 6')}">
</FORM>

    Notice the usage of the getAttributeNode() method above. Also, notice the similarity between getAttribute() and getAttributeNode().