zoukankan      html  css  js  c++  java
  • JS基础11-DOM操作表单元素

    一、DOM访问表单控件的常用属性和方法如下:

    action

    返回该表单的提交地址

    elements

    返回表单内全部表单控件所组成的数组,通过数组可以访问表单内的任何表单控件。

    length

    返回表单内表单域的个数

    method

    返回表单内的method属性,主要有getpost两个值

    target

    确定提交表单时的结果窗口,主要有_self_blank_top

    reset()submit()

    重置表单和确定表单方法

    二、elments返回的数组中访问具体的表单控件语法如下:

    .elements[index]

    返回该表单中第index个表单控件

    .elements[elementName]

    返回表单内idnameelementName的表单控件

    .elementName

    返回表单内idnameelementName的表单控件

    <!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>DOM操作表单元素</title>
    
    </head>
    
    <body>
    <form  id="myform" action="https://www.baidu.com/" method="get" target="_blank">
        <input type="text" value="张三"><br>
        <input type="text" value="123" id="t2"><br>
        <select name="" id="t3">
            <option value="北京">北京</option>
            <option value="上海">上海</option>
            <option value="淄博">淄博</option>
            <option value="昆明" selected>昆明</option>
        </select>
        <br>
        <input type="button" value="获取表单内第一个控件" onClick="show(c.elements[0])">
        <input type="button" value="获取表单内第二个控件" onClick="show(c.elements['t2'])">
        <input type="button" value="获取表单内第三个控件" onClick="show(c.t3)">
        <input type="button" value="操作表单" onClick="show(c.reset())">
    </form>
    
    <!--从上往下执行,计算机先读取到id="myform",之后才能给声明的变量c赋值-->
    <script type="text/javascript">
         var c=document.getElementById('myform');
        function show(curr){
            alert(curr.value);
        }
        
    </script>
    </body>
    </html>

     

  • 相关阅读:
    机器学习笔记之Boosting算法
    机器学习笔记之多重共线性问题以及如何解决
    机器学习笔记之在Visual Studio Code中使用Jupyter Notebook
    高数学习笔记之范数与距离度量(python实现)
    机器学习笔记之线性回归最小二乘法(公式推导和非调包实现)
    机器学习笔记之线性回归数学推导
    高数笔记之期望、方差与最小二乘法
    DataTable 去重 测试
    vs2019 项目历史记录
    sql 求和 语句
  • 原文地址:https://www.cnblogs.com/LuckyGJX/p/8654692.html
Copyright © 2011-2022 走看看