js 取值&賦值-form表單

 

form表單元素介紹

CreateTime--2016年9月22日10:25:54

Author:Marydon

<form> 表單元素。

表單中的元素：

<input>表單控件元素

<select>選擇列表元素

<option>選擇列表條目元素

<textarea>文本區域元素

<label>表單標記元素

window.onload = function() {
    //獲取input標簽 
        //方式一
        var inputRadioTags = document.all.course;
        //document.all.name值，如果頁面中只有一個唯一的name值"course",則//inputRadioTags代表的是該單選框對象；如果有多個name="course"，則//inputRadioTags代表的是數組
        console.log(inputRadioTags[0].value);//獲取的是第一個單選框的value屬性
        console.log(inputRadioTags[0].type);//獲取的是第一個單選框的type屬性
        console.log(typeof inputRadioTags[0]);//獲取的是第一個單選框的數據類型
        console.log(inputRadioTags[0].name);//獲取的是第一個單選框的name屬性
        //方式二(通過操縱form標簽獲取)
        console.log(document.forms[0].course[1].value);
        console.log(registForm.course[1].value);
    //方式三：document.getElementsByName("course")[0]
    //方式四：document.getElementsByTagName("input")[0]
    //方式五：document.getElementById("id值");
} 

<form action="#" name="registForm" method="post" onsubmit="return verfication()">
    <input type="radio" name="course" value="語文"/>語文
    <input type="radio" name="course" value="數學"/>數學
</form>

獲取form對象
　　//方法一
　　document.forms[0]
　　//方法二:根據name獲取
　　registForm

form表單元素的自定義屬性的取值

<script type="text/javascript">
    var name = "lisi";
    function test1 () {
        var name = "zhang";
        function test2 () {
            console.log(this.name);
        }    
        alert(name);
        //return test2;
    }        
    window.onload = function () {
        /**
         * 獲取下面這個input標簽
         */
        //方法一：根據name獲取--這種獲取方式，如果存在多個input標簽的name="userName"的，返回就是
        //一個數組；如果只有，返回的就是該標簽對象（只獲取form表單定義的name）
        var inputUnameTag = document.all.userName;
        /**
         * 方法二：也是根據name獲取    
         * var inputUnameTag = document.getElementsByName("userName")[0];
         */
         /**
          * 方法三：根據input標簽獲取
          * var inputUnameTag = document.getElementsByTagName("input")[0];
          */
        //獲取該標簽的自定義onSuccess屬性
        /**
         * 自定義屬性的值的獲取方式
         * 錯誤方式：
         * var aa = inputUnameTag.onSuccess; 自定義屬性無法通過這種方式獲取
         * 正確的方式為：使用getAttribute()方法
        */
        var errorMsg = inputUnameTag.getAttribute("onError");//errorMsg的值為：錯誤
        /**
         * 運行自定義屬性調用的方法
         * 錯誤方式：
         * var ee = inputUnameTag.getAttribute("onSuccess");//這樣獲取的是字符串"test1()"
         * 正確方式：eval()
        */
        var result = eval(inputUnameTag.getAttribute("onSuccess"));
        //會將test1()當作方法來執行，如果有返回值用變量接收
        console.log(cc); //如果沒有定義返回值，則會顯示undefined
    }
</script>

<input onSuccess="test1()" onError="錯誤" name="userName" value="zhang"/>

 

 相關推薦：

• 類似文章