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"/>

相关推荐：

• 类似文章