分享

[筆記]JS 對HTML 操作

JS 對HTML 操作

讀取值

<body>        <input type="text" id="text1" /> <input type="text" id="text2" /> <input type="button" value="加法" id="bt1"/>        <input type="button" value="減法" id="bt2"/>        <input type="button" value="乘法" id="bt3"/>        <input type="button" value="除法" id="bt4"/>        <input type="button" value="取餘" id="bt5"/>   <script >    var oText1=document.getElementById("text1");     var oText2=document.getElementById("text2");            var oBt1=document.getElementById("bt1");     var oBt2=document.getElementById("bt2");     var oBt3=document.getElementById("bt3");     var oBt4=document.getElementById("bt4");     var oBt5=document.getElementById("bt5");
以document.getElementById("Id");  的方式可以取得該所屬id 的元素,對其操作。             而此取得的值資料型態為字串      alert(oText1.value + oText2.value);            若要將齊做數學運算將字串轉為數值            var num1=Number(oText1.value);            var num2=Number(oText2.value);</script> 

寫入值

<body> <!-- 計數功能 --> <input type="text" id="test" />
<h3 id="text">0</h3>
<script >  var oText=document.getElementById("text");  var oBt=document.getElementById("bt");  var oTest=document.getElementById("test");  var index=0;  oBt.onclick=function(){  index=index+1;  //alert(index);  //標籤中的內容 元素.innerHTML   //innerHTML 修改標籤內的內容  oText.innerHTML=index;  //屬性操作 oTest.value=index;
   }    </script> 
分類:學習

評論
上一篇
  • 下一篇
  • 更多文章
    載入中... 沒有更多了