Home > Developer > JavaScript
The W3C standard recommended syntax is to get an element in the DOM tree through the document object. Common methods include getElementById (), getElementsByName (), getElementsByTagName (), they return a single node or node set through the id and name attributes/tag names.
Copy codeThe Code is as follows:
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<Html xmlns = "http://www.w3.org/1999/xhtml">
<Head>
<Meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8"/>
<Title> JavaScript method for retrieving an element on a page </title>
<Script type = "text/javascript">
Function doGetElementsByTagName (){
Var x = document. getElementsByTagName ("input ");
Alert (x. length );
}
Function doGetElementsByName (){
Var x = document. getElementsByName ("myInput ");
Alert (x. length );
}
Function getValue (){
Var x = document. getElementById ("myHeader ");
Alert (x. innerHTML );
}
</Script>
</Head>
<Body>
<H1 id = "myHeader" onclick = "getValue ();"> here is the header <P> click the header to display the content of myHeader. </p>
<Input type = "text" name = "myInput" size = "20"/>
<Br/>
<Br/>
<Input type = "text" name = "myInput" size = "20"/>
<Br/>
<Br/>
<Input type = "text" name = "myInput" size = "20"/>
<Br/>
<Br/>
<Input type = "button" onclick = "doGetElementsByTagName ();" value = "How many input elements are there? "/>
<Br/>
<Input type = "button" onclick = "doGetElementsByName ();" value = "how many names have the value of myInput? "/>
</Body>
</Html>
When you click:, it will pop up:
When you click:, it will pop up:
When you click:, it will pop up:
Especially in the following code,
Copy codeThe Code is as follows:
Function getValue (){
Var x = document. getElementById ("myHeader ");
Alert (x. innerHTML );
}
Involves a knowledge point: html dom innerHTML, which serves all content from the starting position of the object to the ending position, including Html tags
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
