Using the DOM - Java Script

Even though the document object is considered part of the BOM, it is also is a representation of the HTML DOM’s HTMLDocument object,which, in turn,is also an XML DOM Document object.Most DOM manipulation in JavaScript makes use of the document object,so that’s a logical place to begin the discussion.

Accessing relative nodes

Consider the following HTML page for the next few sections:

To access the <html/> element(which you should realize is the document element of this file),you can use the documentElement property of document:
var oHtml = document.documentElement;

The variable oHtml now contains an HTMLElement object representing <html/>.If you want to get the <head/> and <body/>elements using oHtml, this works:

You can also use the childNodes property to accomplish the same thing.Just pretend that it’s a regular JavaScript Array and use square-bracket notation:

You can also get the number of child nodes by using the childNodes.length property:

alert(oHtml.childNodes.length); //outputs “2”

Note that the square-bracket notation is a convenient implementation of the NodeList in JavaScript.The formal method of retrieving child nodes from the childNodes list is the item() method:

The HTML DOM also defines document.body as a pointer to the <body /> element:

var oBody = document.body;

With the three variables oHtml,oHead, and oBody,you can play around to determine their relationship to one another:

This little snippet of code tests to make sure that the parentNode property of both oBody and oHead point to oHtml,as well as uses the previousSibling and nextSibling properties to establish their relationship to one another.The last line assures that the ownerDocument property of oHead actually does point back to the document.

Checking the node type

You can check the type of node by using the nodeType property:

In this example,document.nodeType returns 9,which is equal to Node.DOCUMENT_NODE, and document.documentElement.nodeType returns 1, which is equal to Node.ELEMENT_NODE.

You can also match up these values with the Node constants:

This code works in Mozilla 1.0+, Opera 7.0+, and Safari 1.0+. Unfortunately,Internet Explorer doesn’t support these constant values,so this code causes an error.You can remedy the situation by defining your own constants that match the node type constants,such as the following:

The other option is to use the integer literals(although this may get confusing because not many people have memorized the node type values).

Dealing with attributes

As mentioned previously, only Element nodes have attributes even though the Node interface has an attributes method that is inherited by all node types. The attributes property for an Element node is a NamedNodeMap,which provides several methods for accessing and manipulating its contents:

  • getNamedItem(name) — returns the node whose nodeName property is equal to name
  • removeNamedItem(name) — removes the node whose nodeName property is equal to name from the list
  • setNamedItem(node) — adds the nodeinto the list,indexing it by its nodeName property
  • item(pos) — just like NodeList,returns the node in the numerical position pos

The NamedNodeMap object also has a length property to indicate the number of nodes it contains.

When used to represent attributes,each node in the NamedNodeMap is an Attr node, whose nodeName property is set to the attribute name. The nodeValue property is set to the attribute value. For example,suppose you had this element:

<p> style=”color: red” id=”p1”>Hello world!</p>

Also, uppose that the variable oP that contains a reference to this element.You can access the value of the id attribute like this:

var sId = oP.attributes.getNamedItem(“id”).nodeValue;

Of course,you could access this id attribute numerically, which is a little less intuitive:

var sId = oP.attributes.item(1).nodeValue;

You can change the id attribute by setting a new value to the nodeValue property:

oP.attributes.getNamedItem(“id”).nodeValue = “newId”;

Attr nodes also have a value property that is exactly equal (and kept in sync with) the nodeValue property, as well as a name property that is kept in sync with nodeName. You use any of these properties to modify or change the attributes.

Because this method is a little bit cumbersome, the DOM also defines three element methods to aid in the assignment of attributes:

  • getAttribute(name) — same as attributes.getNamedItem(name).value
  • setAttribute(name, newvalue) — same as attributes.getNamedItem(name).value = newvalue
  • removeAttribute(name) — same as attributes.removeNamedItem(name)

These methods are helpful in that they deal directly with the attribute values,completely hiding the Attr nodes.So, to retrieve the id attribute of the <p /> used earlier, you can just do this:

As you can see, these methods are much less verbose than using the NamedNodeMap methods.

Accessing specific nodes

You already know how to access parent and child nodes,but what if you want access to a node (or group of nodes) that are located deep in the document? Certainly,you don’t want to count child nodes until you get down to what you’re looking for. To help you in this use case, the DOM provides several methods to enable easy access to specific nodes.

getElementsByTagName()

The Core (XML) DOM defines the method getElementsByTagName()to return a NodeList of all Element objects whose tagName property is equal to a specific value.In an Element object, the tagName property is always equal to the name immediately following the less-than symbol — for example, the tagName of <img /> is “img”.The following line of code returns a list of all <img /> elements in a document:

var oImgs = document.getElementsByTagName(“img”);

After storing all of the images in oImgs, you can access them individually in the same way that you access child nodes, by using either square-bracket notation or the item() method (getElementsByTagName() returns a NodeList,just like childNodes):

alert(oImgs[0].tagName);//outputs “IMG”

This line of code outputs the tagName of the first image, which is output as “IMG”. For some reason, most browsers still record the tag name as all uppercase even though XHTML conventions dictate that tag names must be all lowercase.

But suppose you want to get only the images within the first paragraph of a page.This can be accomplished by calling getElementsByTagName() on the first paragraph elementlike this:

You can use this one method to get down to any element in the document or to get all elements in the document by using an asterisk:

var oAllElements = document.getElementsByTagName(“*”);

This line of code returns all the elements contained in document regardless of their tag names.

getElementsByName()

The HTML DOM defines getElementsByName() to retrieve all elements that have their name attributeset to a specific value. Consider the following HTML:

This page asks the user which color he/she likes.The radio buttons all have the same name,because you only want to return one value for this field, which is the value attribute of the selected radio button. To get references to all the radio button elements, you can use the following code:

var oRadios = document.getElementsByName(“radColor”);

You can then manipulate the radio buttons the same way as you can any other element:

alert(oRadios[0].getAttribute(“value”)); //outputs “red”

getElementById()

The second method defined by the HTML DOM is getElementById(),which returns an element with its id attribute set to a specific value.In HTML, the id attribute is unique—meaning that no two elements can share the same id. This is undoubtedly the fastest method of retrieving a single specific element from the document tree. Suppose you have the following HTML page:

To access the <div /> element with the ID “div1”, you can use the getElementsByTagName() like this:

Or,you could use getElementById() like this:

var oDiv1 = document.getElementById(“div1”);

As you can see, this is a much more streamlined way to get a reference to a specific element.

Creating and manipulating nodes

So far, you’ve learned how to access various nodes inside of a document, but that’s just the beginning of what can be done using the DOM. You can also add,remove,replace, and otherwise manipulate nodes within a DOM document. This functionality is what makes the DOM truly dynamic.

Creating new nodes

The DOM Document has a number of methods designed to create various types of nodes,even though the browser document object doesn’t necessarily support each of these methods in all browsers. The following table lists the methods included in DOM Level 1 and which browsers support each other.

Creating new nodesCreating new nodes

The most commonly used methods are createDocumentFragment(),createElement(), and createTextNode(); the other methods are either not useful (createComment()) or not supported by enough browsers to be useful at this point in time.

createElement(),createTextNode(),appendChild()

Suppose you have the following HTML page:

To this page, you want to add the following code using the DOM:

<p>Hello World!</p>

The createElement() and createTextNode() methods can be used to accomplish this. Here’s how.

The first thing to do is create the <p/> element:

var oP = document.createElement(“p”);

Second, create the text node:

var oText = document.createTextNode(“Hello World!”);

Next you need to add the text node to the element. To do this, you can use the appendChild() method,which was briefly mentioned earlier in the chapter. The appendChild() method exists on every node type and is used to add a given node to the end of another’s childNodes list. In this case, the text node should be added to the <p /> element:

oP.appendChild(oText);

You’re not done quite yet.You have created the element and text node and attached them to each other, but the element still doesn’t have a spot in the document.To actually be visible, the element must be attached either to the document.body element or one of its children. Once again, you can use the appendChild() method for this:

document.body.appendChild(oP);

To put all this into a sample you can run,just create a function containing each of these steps and call it when the page is loaded by using the onload event handler.

When you run this code,the message “Hello World!” is displayed as if it were part of the HTML document all along.

removeChild(),replaceChild(), and insertBefore()

Naturally,if you can add a node you can also remove a node, which is where the removeChild() method comes in. This method accepts one argument,the node to remove,and then returns that node as the function value.So if, for instance, you start out with a page already containing the “Hello World!” message and you wanted to remove it, you can use the method like this:

When this page is loaded,it displays a blank screen because the message is removed even before you have a chance to see it. Although this works, it’s always better to use a node’s parentNode property to make sure you are accessing its real parent:

But what if you want to replace this message with a new one? In that case, you can use the replaceChild() method. The replaceChild() method takes two arguments: the node to add and the node to replace. In this case, you create a new element with a new message and replace the <p /> element with the “Hello World!” message.

<html>
<head>
<title>replaceChild() Example</title>
<script type=”text/javascript”>
function replaceMessage() {
var oNewP = document.createElement(“p”);
var oText = document.createTextNode(“Hello Universe! “);
oNewP.appendChild(oText);
var oOldP = document.body.getElementsByTagName(“p”)[0];
oOldP.parentNode.replaceChild(oNewP, oOldP);
}
</script>
</head>
<body onload=”replaceMessage()”>
<p>Hello World!</p>
</body>
</html>

This sample page replaces the message “Hello World!” with “Hello Universe!” Note that this code still uses the parentNode property to ensure the correct parent is being manipulated. Of course,you may want both messages to appear.If you want the new message to come after the old message,use the appendChild() method:

If,however,you want the new message to come before the old, use the insertBefore() method.This method accepts two arguments: the new node to add and the node that it should be inserted before.In this example, the second argument is the <p /> element containing “Hello World!”:

createDocumentFragment()

As soon as you add nodes to document.body (or one of its ancestors), the page is updated to reflect the changes. This is fine for a small number of changes, as in the previous examples.However, when a large amount of data has to be added to the document, it can be a very slow process if it adds changes one-byone.

To correct this situation, you can create a document fragment to which you attach all new nodes, and then add the contents of the document fragment to the document. Suppose you want to create ten new paragraphs.Using the methods you learned previously, you write this code:

This code works just fine, the problem is that it’s making ten calls to document.body.appendChild(),which causes a refresh of the page each time. This is where the document fragment is useful:

In this code, each new <p /> element is added to the document fragment. Then,the fragment is passed in as the argument to appendChild().The call to appendChild() doesn’t actually append the document fragment node itself to the <body /> element; instead, it just appends the fragment’s child nodes. You can see the obvious performance gains: One call to document.body.appendChild() instead of 10 means only one screen refresh.

Even though the document object is considered part of the BOM, it is also is a representation of the HTML DOM’s HTMLDocument object,which, in turn,is also an XML DOM Document object.Most DOM manipulation in JavaScript makes use of the document object,so that’s a logical place to begin the discussion.

Accessing relative nodes

Consider the following HTML page for the next few sections:

To access the <html/> element(which you should realize is the document element of this file),you can use the documentElement property of document:

var oHtml = document.documentElement;

The variable oHtml now contains an HTMLElement object representing <html/>.If you want to get the <head/> and <body/>elements using oHtml, this works:

You can also use the childNodes property to accomplish the same thing.Just pretend that it’s a regular JavaScript Array and use square-bracket notation:

You can also get the number of child nodes by using the childNodes.length property:

alert(oHtml.childNodes.length); //outputs “2”

Note that the square-bracket notation is a convenient implementation of the NodeList in JavaScript.The formal method of retrieving child nodes from the childNodes list is the item() method:

The HTML DOM also defines document.body as a pointer to the <body /> element:

var oBody = document.body;

With the three variables oHtml,oHead, and oBody,you can play around to determine their relationship to one another:

This little snippet of code tests to make sure that the parentNode property of both oBody and oHead point to oHtml,as well as uses the previousSibling and nextSibling properties to establish their relationship to one another.The last line assures that the ownerDocument property of oHead actually does point back to the document.

Checking the node type

You can check the type of node by using the nodeType property:

In this example,document.nodeType returns 9,which is equal to Node.DOCUMENT_NODE, and document.documentElement.nodeType returns 1, which is equal to Node.ELEMENT_NODE.

You can also match up these values with the Node constants:

This code works in Mozilla 1.0+, Opera 7.0+, and Safari 1.0+. Unfortunately,Internet Explorer doesn’t support these constant values,so this code causes an error.You can remedy the situation by defining your own constants that match the node type constants,such as the following:

The other option is to use the integer literals(although this may get confusing because not many people have memorized the node type values).

Dealing with attributes

As mentioned previously, only Element nodes have attributes even though the Node interface has an attributes method that is inherited by all node types. The attributes property for an Element node is a NamedNodeMap,which provides several methods for accessing and manipulating its contents:

  • getNamedItem(name) — returns the node whose nodeName property is equal to name
  • removeNamedItem(name) — removes the node whose nodeName property is equal to name from the list
  • setNamedItem(node) — adds the nodeinto the list,indexing it by its nodeName property
  • item(pos) — just like NodeList,returns the node in the numerical position pos

The NamedNodeMap object also has a length property to indicate the number of nodes it contains.

When used to represent attributes,each node in the NamedNodeMap is an Attr node, whose nodeName property is set to the attribute name. The nodeValue property is set to the attribute value. For example,suppose you had this element:

<p> style=”color: red” id=”p1”>Hello world!</p>

Also, uppose that the variable oP that contains a reference to this element.You can access the value of the id attribute like this:

var sId = oP.attributes.getNamedItem(“id”).nodeValue;

Of course,you could access this id attribute numerically, which is a little less intuitive:

var sId = oP.attributes.item(1).nodeValue;

You can change the id attribute by setting a new value to the nodeValue property:

oP.attributes.getNamedItem(“id”).nodeValue = “newId”;

Attr nodes also have a value property that is exactly equal (and kept in sync with) the nodeValue property, as well as a name property that is kept in sync with nodeName. You use any of these properties to modify or change the attributes.

Because this method is a little bit cumbersome, the DOM also defines three element methods to aid in the assignment of attributes:

  • getAttribute(name) — same as attributes.getNamedItem(name).value
  • setAttribute(name, newvalue) — same as attributes.getNamedItem(name).value = newvalue
  • removeAttribute(name) — same as attributes.removeNamedItem(name)

These methods are helpful in that they deal directly with the attribute values,completely hiding the Attr nodes.So, to retrieve the id attribute of the <p /> used earlier, you can just do this:

As you can see, these methods are much less verbose than using the NamedNodeMap methods.

Accessing specific nodes

You already know how to access parent and child nodes,but what if you want access to a node (or group of nodes) that are located deep in the document? Certainly,you don’t want to count child nodes until you get down to what you’re looking for. To help you in this use case, the DOM provides several methods to enable easy access to specific nodes.

getElementsByTagName()

The Core (XML) DOM defines the method getElementsByTagName()to return a NodeList of all Element objects whose tagName property is equal to a specific value.In an Element object, the tagName property is always equal to the name immediately following the less-than symbol — for example, the tagName of <img /> is “img”.The following line of code returns a list of all <img /> elements in a document:

var oImgs = document.getElementsByTagName(“img”);

After storing all of the images in oImgs, you can access them individually in the same way that you access child nodes, by using either square-bracket notation or the item() method (getElementsByTagName() returns a NodeList,just like childNodes):

alert(oImgs[0].tagName); //outputs “IMG”

This line of code outputs the tagName of the first image, which is output as “IMG”. For some reason, most browsers still record the tag name as all uppercase even though XHTML conventions dictate that tag names must be all lowercase.

But suppose you want to get only the images within the first paragraph of a page.This can be accomplished by calling getElementsByTagName() on the first paragraph elementlike this:

var oPs = document.getElementsByTagname(“p”);
var oImgsInP = oPs[0].getElementsByTagName(“img”);

You can use this one method to get down to any element in the document or to get all elements in the document by using an asterisk:

var oAllElements = document.getElementsByTagName(“*”);

This line of code returns all the elements contained in document regardless of their tag names.

getElementsByName()

The HTML DOM defines getElementsByName() to retrieve all elements that have their name attributeset to a specific value. Consider the following HTML:

This page asks the user which color he/she likes.The radio buttons all have the same name,because you only want to return one value for this field, which is the value attribute of the selected radio button. To get references to all the radio button elements, you can use the following code:

var oRadios = document.getElementsByName(“radColor”);

You can then manipulate the radio buttons the same way as you can any other element:

alert(oRadios[0].getAttribute(“value”)); //outputs “red”

getElementById()

The second method defined by the HTML DOM is getElementById(),which returns an element with its id attribute set to a specific value.In HTML, the id attribute is unique—meaning that no two elements can share the same id. This is undoubtedly the fastest method of retrieving a single specific element from the document tree. Suppose you have the following HTML page:

To access the <div /> element with the ID “div1”, you can use the getElementsByTagName() like this:

Or,you could use getElementById() like this:

var oDiv1 = document.getElementById(“div1”);

As you can see, this is a much more streamlined way to get a reference to a specific element.

Creating and manipulating nodes

So far, you’ve learned how to access various nodes inside of a document, but that’s just the beginning of what can be done using the DOM. You can also add,remove,replace, and otherwise manipulate nodes within a DOM document. This functionality is what makes the DOM truly dynamic.

Creating new nodes

The DOM Document has a number of methods designed to create various types of nodes,even though the browser document object doesn’t necessarily support each of these methods in all browsers. The following table lists the methods included in DOM Level 1 and which browsers support each other.

Creating new nodesCreating new nodes

The most commonly used methods are createDocumentFragment(),createElement(), and createTextNode(); the other methods are either not useful (createComment()) or not supported by enough browsers to be useful at this point in time.

createElement(),createTextNode(),appendChild()

Suppose you have the following HTML page:

To this page, you want to add the following code using the DOM:

<p>Hello World!</p>

The createElement() and createTextNode() methods can be used to accomplish this. Here’s how.

The first thing to do is create the <p/> element:

var oP = document.createElement(“p”);

Second, create the text node:

var oText = document.createTextNode(“Hello World!”);

Next you need to add the text node to the element. To do this, you can use the appendChild() method,which was briefly mentioned earlier in the chapter. The appendChild() method exists on every node type and is used to add a given node to the end of another’s childNodes list. In this case, the text node should be added to the <p /> element:

oP.appendChild(oText);

You’re not done quite yet.You have created the element and text node and attached them to each other, but the element still doesn’t have a spot in the document.To actually be visible, the element must be attached either to the document.body element or one of its children. Once again, you can use the appendChild() method for this:

document.body.appendChild(oP);

To put all this into a sample you can run,just create a function containing each of these steps and call it when the page is loaded by using the onload event handler.

When you run this code,the message “Hello World!” is displayed as if it were part of the HTML document all along.

removeChild(),replaceChild(), and insertBefore()

Naturally,if you can add a node you can also remove a node, which is where the removeChild() method comes in. This method accepts one argument,the node to remove,and then returns that node as the function value.So if, for instance, you start out with a page already containing the “Hello World!” message and you wanted to remove it, you can use the method like this:

When this page is loaded,it displays a blank screen because the message is removed even before you have a chance to see it. Although this works, it’s always better to use a node’s parentNode property to make sure you are accessing its real parent:

But what if you want to replace this message with a new one? In that case, you can use the replaceChild() method. The replaceChild() method takes two arguments: the node to add and the node to replace. In this case, you create a new element with a new message and replace the <p /> element with the “Hello World!” message.

This sample page replaces the message “Hello World!” with “Hello Universe!” Note that this code still uses the parentNode property to ensure the correct parent is being manipulated. Of course,you may want both messages to appear.If you want the new message to come after the old message,use the appendChild() method:

If,however,you want the new message to come before the old, use the insertBefore() method.This method accepts two arguments: the new node to add and the node that it should be inserted before.In this example, the second argument is the <p /> element containing “Hello World!”:

createDocumentFragment()

As soon as you add nodes to document.body (or one of its ancestors), the page is updated to reflect the changes. This is fine for a small number of changes, as in the previous examples.However, when a large amount of data has to be added to the document, it can be a very slow process if it adds changes one-byone.

To correct this situation, you can create a document fragment to which you attach all new nodes, and then add the contents of the document fragment to the document. Suppose you want to create ten new paragraphs.Using the methods you learned previously, you write this code:

This code works just fine, the problem is that it’s making ten calls to document.body.appendChild(),which causes a refresh of the page each time. This is where the document fragment is useful:

In this code, each new <p /> element is added to the document fragment. Then,the fragment is passed in as the argument to appendChild().The call to appendChild() doesn’t actually append the document fragment node itself to the <body /> element; instead, it just appends the fragment’s child nodes. You can see the obvious performance gains: One call to document.body.appendChild() instead of 10 means only one screen refresh.

Even though the document object is considered part of the BOM, it is also is a representation of the HTML DOM’s HTMLDocument object,which, in turn,is also an XML DOM Document object.Most DOM manipulation in JavaScript makes use of the document object,so that’s a logical place to begin the discussion.

Accessing relative nodes

Consider the following HTML page for the next few sections:

To access the <html/> element(which you should realize is the document element of this file),you can use the documentElement property of document:

var oHtml = document.documentElement;

The variable oHtml now contains an HTMLElement object representing <html/>.If you want to get the

<head/> and <body/>elements using oHtml, this works:

You can also use the childNodes property to accomplish the same thing.Just pretend that it’s a regular JavaScript Array and use square-bracket notation:

You can also get the number of child nodes by using the childNodes.length property:

alert(oHtml.childNodes.length); //outputs “2”

Note that the square-bracket notation is a convenient implementation of the NodeList in JavaScript.The formal method of retrieving child nodes from the childNodes list is the item() method:

The HTML DOM also defines document.body as a pointer to the <body /> element:

var oBody = document.body;

With the three variables oHtml,oHead, and oBody,you can play around to determine their relationship to one another:

This little snippet of code tests to make sure that the parentNode property of both oBody and oHead point to oHtml,as well as uses the previousSibling and nextSibling properties to establish their relationship to one another.The last line assures that the ownerDocument property of oHead actually does point back to the document.

Checking the node type

You can check the type of node by using the nodeType property:

In this example,document.nodeType returns 9,which is equal to Node.DOCUMENT_NODE,and document.documentElement.nodeType returns 1, which is equal to Node.ELEMENT_NODE.

You can also match up these values with the Node constants:

This code works in Mozilla 1.0+, Opera 7.0+, and Safari 1.0+. Unfortunately,Internet Explorer doesn’t support these constant values,so this code causes an error.You can remedy the situation by defining your own constants that match the node type constants,such as the following:

The other option is to use the integer literals(although this may get confusing because not many people have memorized the node type values).

Dealing with attributes

As mentioned previously, only Element nodes have attributes even though the Node interface has an attributes method that is inherited by all node types. The attributes property for an Element node is a NamedNodeMap,which provides several methods for accessing and manipulating its contents:

  • getNamedItem(name) — returns the node whose nodeName property is equal to name
  • removeNamedItem(name) — removes the node whose nodeName property is equal to name from the list
  • setNamedItem(node) — adds the nodeinto the list,indexing it by its nodeName property
  • item(pos) — just like NodeList,returns the node in the numerical position pos

The NamedNodeMap object also has a length property to indicate the number of nodes it contains.

When used to represent attributes,each node in the NamedNodeMap is an Attr node, whose nodeName property is set to the attribute name. The nodeValue property is set to the attribute value. For example,suppose you had this element:

<p style=”color: red” id=”p1”>Hello world!</p>

Also, uppose that the variable oP that contains a reference to this element.You can access the value of the id attribute like this:

var sId = oP.attributes.getNamedItem(“id”).nodeValue;

Of course,you could access this id attribute numerically, which is a little less intuitive:

var sId = oP.attributes.item(1).nodeValue;

You can change the id attribute by setting a new value to the nodeValue property:
oP.attributes.getNamedItem(“id”).nodeValue = “newId”; Attr nodes also have a value property that is exactly equal (and kept in sync with) the nodeValue property, as well as a name property that is kept in sync with nodeName. You use any of these properties to modify or change the attributes.

Because this method is a little bit cumbersome, the DOM also defines three element methods to aid in the assignment of attributes:

  • getAttribute(name) — same as attributes.getNamedItem(name).value
  • setAttribute(name, newvalue) — same as attributes.getNamedItem(name).value = newvalue
  • removeAttribute(name) — same as attributes.removeNamedItem(name)

These methods are helpful in that they deal directly with the attribute values,completely hiding the Attr nodes.So, to retrieve the id attribute of the <p /> used earlier, you can just do this:

As you can see, these methods are much less verbose than using the NamedNodeMap methods.

Accessing specific nodes

You already know how to access parent and child nodes,but what if you want access to a node (or group of nodes) that are located deep in the document? Certainly,you don’t want to count child nodes until you get down to what you’re looking for. To help you in this use case, the DOM provides several methods to enable easy access to specific nodes.

getElementsByTagName()

The Core (XML) DOM defines the method getElementsByTagName()to return a NodeList of all Element objects whose tagName property is equal to a specific value.In an Element object, the tagName property is always equal to the name immediately following the less-than symbol — for example, the tagName of <img /> is “img&


All rights reserved © 2018 Wisdom IT Services India Pvt. Ltd DMCA.com Protection Status

Java Script Topics