表單及其控件的訪問

時間 2020-06-27

標籤表單及其控件訪問欄目 HTML 简体版

原文原文鏈接

表單及其控件(元素)的訪問方式

1.採用表單名稱.控件名稱.屬性html

表單名稱.控件名稱.方法(參數)html5

2.採用forms[下標].elements[下標/元素id名稱/元素name名稱].屬性，elements表示表單裏面的全部元素的數組數組

forms[下標].elements[下標/元素id名稱/元素name名稱].方法(參數)spa

3.訪問select下拉列表option元素的方法code

select的id名稱.options[下標].屬性orm

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body><!--placeholder是html5的新屬性，須要注意兼容性-->
        <form id="dd" name="calc">
            <input type="text" name="tx1"  placeholder="請在這裏輸入信息" value="111" />+
            <input type="text" name="tx2" value="222" readonly/>
            =<span id="d2"></span>
            <input type="button"  onclick="cal()" value="計算" />
             
            
        </form>
        <script>
           function cal()
            {

//documnet表示頁面上的全部對象元素，在經過表單的id名或者name去引用想要的屬性值

//經過document.表單id名稱calc.元素的id名稱tx1.屬性


var t1=document.calc.tx1.value;

//經過documnet.forms[下標].elements[下標].屬性;

var t2=document.forms[0].elements[1].value;

document.getElementById("d2").innerHTML=parseFloat(t1)+parseFloat(t2); } 

</script> </body> </html>

代碼效果圖以下htm

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。