Visit DOM node 2 - getElementsByTagName ()
Use getElementsByTagName (), in accordance with the label's name, a select number of the elements.
This section notes reference guide:
- Chinese: DOM nodes visit
- English: DOM Node Access
GetElementsByTagName ()
Use a presentation getElementById () method, one can only access a node, the reason is very simple, it is in the HTML id as a choice conditions. DOM provided another batch selected node approach - getElementsByTagName (). To label it as a choice, for example, the following JavaScript code in the current Web page will be selected all the paragraphs.
Document.getElementsByTagName ( "p")
Based on an experience, we might be able to immediately carry out some of these paragraphs of the operation. However, getElementsByTagName () returns is not a node, but a node list. So if we want to achieve all the above paragraphs of the code to operate, ways will be different. Or view an example.
Use getElementsByTagName () Case
<script Type="text/javascript" />
Function allPara () (
/ / Paras all paragraphs storage
Paras = document.getElementsByTagName ( "p");
/ / ParaNum cycle variables, each individual selected for the paragraphs
Var paraNum;
/ / From scratch cycle, paras.length paragraph is the number of nodes
For (var paraNum = 0; paraNum <paras.length; paraNum + +)
(
/ / Operator: paragraphs to set borders.
Paras [paraNum]. Style.border = "1px dashed pink";
)
)
</ Script>
On the interpretation of this code has been written in the notes. Click on the button to test it.
Combined use of getElementById () and getElementsByTagName ()
Sometimes, we may not want all the selected page of paragraphs, but rather a specific part of the selected paragraphs (or other elements). In fact, we can use these two functions to achieve, for example, the following code will be to find the id element for content, it further within the selected paragraphs.
Cparas = document.getElementById ( "content"). GetElementsByTagName ( "p");
Click the button below, you can see what all the selected paragraphs. Pay attention to the upper left corner of this page that there are no borders and set the background color paragraphs. Because it is not in the content of the div id, it has not been selected.
- On one: Visit DOM Node 1 - getElementById ()
- Visit DOM node 2 - getElementsByTagName ()
- The following section: