Home > Developer > JavaScript
Profile:
Programming interface
The HTML DOM can be accessed through JavaScript.
All HTML elements are defined as objects, while programming interfaces are object methods and object properties.
Methods are actions that you can perform (such as adding or modifying elements).
A property is a value that you can get or set (such as the name or content of a node).
(i) through the GetElement series method:
document.getElementById ();//id
document.getElementsByTagName ();//tag name, elements Plus s, selected is an array of classes;
Document.getelementsbyname ();//name attribute, partial label can be, elements add s, select is class array;
Document.getelementsbyclassname ();//class;elements plus S, selected is an array of classes; IE9 below is not supported;
Document represents the entire documentation
Byid is to get an element node;
Bytagname,byname,byclassname gets an array of classes;
(ii) Traversing the node tree
ParentNode//parent element, top-level parent element is document;
ChildNodes//Sub-nodes
FirstChild//first child node
LastChild//Last child node
NextSibling//After a sibling node
Previoussiling//Previous sibling node
Note that the child nodes, not only the element nodes, text, annotations and so on belong to the node;
(iii) Traversal of node trees based on elements
Parentelement
Children
Nextelementsibling
Previouselementsibling
Firstelementchild
Lastelementchild
In addition to the children, several other IE9 versions are not supported;
1<body>2<divclass="Div1">3<!--this isComment--4<strong></strong>5<p>6<span></span>7</p>8<em></em>9</div>Ten One<script type="Text/javascript"> A vardiv = document.getElementsByTagName ('Div')[0]; -</script> -</body>
Supplemental node Knowledge:
In the Document Object Model (DOM), each node is an object. The DOM node has three important properties:
1. NodeName: Name of the node
2. NodeValue: The value of the node
3. NodeType: Type of node
One, NodeName property: The name of the node, is read-only.
1. The nodeName of the element node is the same as the label name
2. The nodeName of the attribute node is the name of the property
3. The nodeName of a text node is always #text
4. The nodeName of the document node is always #document
Second, NodeValue property: The value of the node
1. The nodevalue of the element node is undefined or null
2. Text node NodeValue is the text itself
3. The nodevalue of the attribute node is the value of the property
nodeType attribute: The type of the node, which is read-only. Here are some common types of nodes:
Examples of Practice:
The following program fragment implementation function: Return all elements of a node child nodes (do not use the children method)
1<body>2<divclass="Div1">3<!--this isComment--4<strong></strong>5<p>6<span></span>7</p>8<em></em>9</div>Ten One<script type="Text/javascript"> A vardiv = document.getElementsByTagName ('Div')[0]; - - function Returnelementchild () { the vararr = [], -Child =Div.childnodes; - for(vari =0; i < child.length; i++){ - if(Child[i].nodetype = =1) + Arr.push (Child[i]); - } + returnarr; A } at - Console.log (Returnelementchild (Div)); -</script> -</body>
Dom manipulation of javascript: finding ELEMENT nodes
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
