js 取值&赋值-form表单

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

 

写在最后

  哪位大佬如若发现文章存在纰漏之处或需要补充更多内容,欢迎留言!!!

 相关推荐:

posted @ 2017-03-13 09:55  Marydon  阅读(8991)  评论(0编辑  收藏  举报