標籤：
執行個體1：
?</head>
?<body>
? <div id="div1">
? ?<p id="p1">這是一個段落</p>
? ?<p id="p2">這是另外一個段落</p>
? ? ?
? </div>
?</body>
?<script type="text/javascript" language="JavaScript">
? var pare=document.createElement("p");//建立一個p標籤的元素
? var node=document.createTextNode("這是一個新段落");//建立一個文本節點
? pare.appendChild(node);//向p標籤裡面追加文本的子節點
? ?
? var element=document.getElementById("div1");
? element.appendChild(pare);//然後直接向div中追加p標籤
?</script>
</html>
執行個體2
購物車的例子
<html>
?<head>
? <meta charset="utf-8">
? <title></title>
?</head>
?<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+"元";
? }
?</script>
?<body>
? <h1>購物車</h1>
? <input type="checkbox" name="fruit" onclick="gouwu(this)" value="10"/>蘋果10元<br />
? <input type="checkbox" name="fruit" onclick="gouwu(this)" value="20"/>香蕉20元<br />
? <input type="checkbox" name="fruit" onclick="gouwu(this)" value="30"/>菠蘿30元<br />
? <input type="checkbox" name="fruit" onclick="gouwu(this)" value="50"/>哈密瓜50元<br /><br />
? 總價格：<span id="myspan" >0元</span>
?</body>
</html>
執行個體三
<html>
?<head>
? <meta charset="utf-8">
? <title></title>
?</head>
?<script type="text/javascript" language="JavaScript">
? function selectCheckbox(obj){
? ?var fruits=document.getElementsByName("fruit");
? ?if(obj.innerText==‘全選‘){
? ? 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="10"/>蘋果10元<br />
? <input type="checkbox" name="fruit" onclick="gouwu(this)" value="20"/>香蕉20元<br />
? <input type="checkbox" name="fruit" onclick="gouwu(this)" value="30"/>菠蘿30元<br />
? <input type="checkbox" name="fruit" onclick="gouwu(this)" value="50"/>哈密瓜50元<br />
? <a href="#" onclick="selectCheckbox(this)">全選</a>
? <a href="#" onclick="selectCheckbox(this)">取消</a><br />
? <input type="checkbox" id="mycheckbox" onclick="selectCheckbox2()"/>是否全選
?
forms對象集合/form對象
froms對象集合有：
length ：返回大小
item（index）：指定取出forms對象集合的第幾個form對象，
?
說明當訪問某個表單的第幾個元素的時候，可以
1.document。forms[第幾個表單].元素名字
2.document.forms.item[第幾個表單].元素名字
?
?
Java script 的dom編程
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
