Example 1:
<body>
<div id= "Div1" >
<p id= "P1" > This is a paragraph </p>
<p id= "P2" > This is another paragraph </p>
</div>
</body>
<script type= "Text/javascript" language= "JavaScript" >
var pare=document.createelement ("P");//Create a P-tag element
var Node=document.createtextnode ("This is a new paragraph");//Create a text node
Pare.appendchild (node);//Sub-node appending text to P tag
var Element=document.getelementbyid ("Div1");
Element.appendchild (pare);//Then append the P tag directly to the DIV
</script>
Example 2
Examples of Shopping carts
<meta charset= "Utf-8" >
<title></title>
<script type= "Text/javascript" language= "JavaScript" >
function Gouwu (object) {
var fruits=document.getelementsbyname ("fruit");
var totalprice=0;
for (Var i=0;i<fruits.length;i++) {
if (fruits[i].checked) {
Totalprice+=parseint (Fruits[i].value);
}
}
Myspan.innertext=totalprice+ "Yuan";
}
</script>
<body>
<input type= "checkbox" name= "Fruit" onclick= "Gouwu (This)" value= "/> Apple 10 yuan <br/>
<input type= "checkbox" name= "Fruit" onclick= "Gouwu (This)" value= "/> Banana 20 yuan <br/>
<input type= "checkbox" name= "Fruit" onclick= "Gouwu (This)" value= ""/> Pineapple 30 yuan <br/>
<input type= "checkbox" name= "Fruit" onclick= "Gouwu (This)" value= "50"/> Hami melon RMB <br/><br/>
Total Price: <span id= "MySpan" >0 yuan </span>
</body>
Example Three
<meta charset= "Utf-8" >
<title></title>
<script type= "Text/javascript" language= "JavaScript" >
function Selectcheckbox (obj) {
var fruits=document.getelementsbyname ("fruit");
if (obj.innertext== ' Select All ') {
for (i=0;i<fruits.length;i++) {
Fruits[i].checked=true;
}
}else{
for (i=0;i<fruits.length;i++) {
Fruits[i].checked=false;
}
}
}
function SelectCheckbox2 () {
var fruits=document.getelementsbyname ("fruit");
if (mycheckbox.checked) {
for (i=0;i<fruits.length;i++) {
Fruits[i].checked=true;
}
}else{
for (i=0;i<fruits.length;i++) {
Fruits[i].checked=false;
}
}
}
</script>
<body>
<input type= "checkbox" name= "Fruit" onclick= "Gouwu (This)" value= "/> Apple 10 yuan <br/>
<input type= "checkbox" name= "Fruit" onclick= "Gouwu (This)" value= "/> Banana 20 yuan <br/>
<input type= "checkbox" name= "Fruit" onclick= "Gouwu (This)" value= ""/> Pineapple 30 yuan <br/>
<input type= "checkbox" name= "Fruit" onclick= "Gouwu (This)" value= "50"/> Hami melon $ <br/>
<a href= "#" onclick= "Selectcheckbox (This)" > select all </a>
<a href= "#" onclick= "Selectcheckbox (This)" > Cancel </a><br/>
<input type= "checkbox" id= "MyCheckBox" onclick= "SelectCheckbox2 ()"/> Whether select all
Forms Object Collection/form object
The Froms object collection is:
Length: Return size
Item (Index): Specifies the first form object to take out the collection of forms objects.
Description when accessing the first element of a form, you can
1.document. forms[the first few forms]. Element name
2.document.forms.item[the first few forms]. Element name
DOM Programming for Java script