黑马程序员技术交流社区

标题: [石家庄校区]学习笔记 [打印本页]
作者: 859182973    时间: 2018-12-17 10:09
标题: [石家庄校区]学习笔记
HTML input  标签(个别兼容性不是很好)
<form actiion="#" method="get">
    用户名<input name="username" placeholder="请输入用户名"><br>
    密码<input name="password"><br>

    <!--隐藏输入的密码-->
    密码<input type="password" name="password"><br>


    <!--单选框    name 属性的值必须一样才可以单选     不一样不行滴-->
    性别 <input type="radio" name="gender" value="male">男
    <input type="radio" name="gender" value="female">女
    <br>
    <!--复选框                    type="checkbox"      -->
    爱好<input type="checkbox" name="hobby" value="shopping">逛街
    <input type="checkbox" name="hobby" value="JAVA">学JAVA
    <input type="checkbox" name="hobby" value="game">玩游戏
    <br>
    <!--checked属性    ,可以指定默认值-->
    checked属性
    <input type="radio" checked name="gender1" value="female">女
    <input type="radio" name="gender1" value="female">男
    <br>

    <!--指定输入框中的提示信息     placeholder="请输入用户名"   -->
    用户名<input name="username" placeholder="请输入用户名"><br>
    <br>


    <!--label的for属性一般会和 input 的 id属性值 对应。如果对应了，则点击label区域，会让input输入框获取焦点。
       <label >用户名</label>      -->
    <label>用户名</label> <input name="username" placeholder="请输入用户名"><br>
    <br>

    <!--上传文件-->
上传文件:
<input type="file" name="file"><br>
<br>

    <!--隐藏域         hidden：隐藏域，用于提交一些信息。(页面看不到隐藏域)    -->
隐藏域
<input type="hidden" name="hidden"value="隐藏域">
<br>


    <!--设置一个按钮     submit：提交按钮。可以提交表单         -->
    <input type="submit" value="登录"><br>
    <br>

    <!--button：普通按钮-->
    <input type="button" value="就是一个按钮"><br>
    <br>

    <!--image：图片提交按钮把一个图片当做按钮   通过src属性指定图片的路径  -->
    <input type="image" src="image/jiangwai_1.jpg" value="就是一个按钮"><br>
    <br>

    <!--取色器-->
    取色器
    <input type="color" name="color">
<br>

    <!--生日-->
    生日
    <input type="date" name="birthday">
    <input type="datetime-local" name="birthdays">
<br>       
    <!--邮箱 自带校验   -->
    邮箱
    <input type="email"name="email">
<br>       
    <!--年龄-->
    年龄
    <input type="number" name="age">
<br>

<!--select: 下拉列表 * 子元素：option，指定列表项-->
省份
<select name="province">
     <option>请选择</option>
     <option>北京</option>
     <option>上海</option>
     <option>广州</option>
</select>
<br>

<!--文本域   * textarea：文本域* cols：指定列数，每一行有多少个字符* rows：默认多少行。
文本域可以放大量文本-->
文本域
<textarea cols="20"  rows="5"></textarea>
<br>


我就是一个按钮
<button>我就是一个按钮</button>
<br>

</form>

重点
概念：用于采集用户输入的数据的。用于和服务器进行交互。
    * form：用于定义表单的。可以定义一个范围，范围代表采集用户数据的范围
        * 属性：
            * action：指定提交数据的URL
            * method:指定提交方式
                * 分类：一共7种，2种比较常用
                   * get：
                        1. 请求参数会在地址栏中显示。会封装到请求行中(HTTP协议后讲解)。
                        2. 请求参数大小是有限制的。
                        3. 不太安全。
                   * post：
                        2. 请求参数不会再地址栏中显示。会封装在请求体中(HTTP协议后讲解)
                        2. 请求参数的大小没有限制。
                        3. 较为安全。
​
        * 表单项中的数据要想被提交：必须指定其name属性
file:///D:/%E7%AC%94%E8%AE%B0/qqC0B4ABE05F58B4253FDE3D8C724FC0B5/ab2308451f3b4bcab1f68a1795c8a649/d821b0dbe20a4eb697b1a5bb160c1f83.jpg






欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/) 黑马程序员IT技术论坛 X3.2