HTML之表单初识

最新推荐文章于 2024-11-05 18:18:48 发布

Monster_Day

最新推荐文章于 2024-11-05 18:18:48 发布

阅读量3.4k

点赞数 1

分类专栏： HTML笔记文章标签： HTML学习之路

本文链接：https://blog.youkuaiyun.com/Monster_Day/article/details/52258413

版权

HTML笔记专栏收录该内容

1 篇文章

订阅专栏


    感觉自己什么都不会，人家编程世家的人一下子就能学好很多东西。他们有什么问题都可以问，有很好的资源，但是对于我们这些 屌丝 探险队来说。我们面前的一切都是未知的。我们什么不懂就只有百度。但是呢，可能要很久才能百度出我们想要的答案，有时候运气太差可能也会找不到我们的答案，也就放弃了。有些人可能会有些疑惑为什么不问老师，因为我是渣校的学生！和同伴们的差距太大了。

好了废话不多说了。下面我们就来初识一下表单：

表单顾名思义是记录某些东西的单子，那么记录这些单子有什么用呢？很显然，它的作用就是客户端和服务器通信的一个媒介。就相当于我们向服务器写信，然后服务器再回信，或者给我们送一些礼物子类的。

在web中有两种提交表单的方式：get 和 post

细心的朋友可能会发现，某些网站在浏览器地址栏会出现类似于这样的信息

http://www.domarvel.cn/html_code/资源分类.html？phone=231312&password=13123&sex=nan&se=l&se=p&birth=0&selfinf=21313

就是那段标红的代码。那么这种方式出现的网页就是以 get 方式向服务器提交信息的那么没出现呢？？对,就是post的方式,提交信息值得注意的是：这样看来get 就会相对不安全而 post就相对安全了。并且由于http通信协议是有限制通信信息大小的。所以 get 方式发送的信息就会笔比较少是有限制的而 post 提交的信息大小就会相当于无限并且是相对安全的。好了，下面我们就贴一段登录界面的代码。表单的代码是很重要的，必须会写

<html>
    <head>
        <!--注意只要是输入项里面都必须要命名 name 不然get不会传递这个输入项的消息，当然前提是不需要有value-->
        <title>表单标签的使用</title><!-- 表单标签很重要 -->
    </head>

    <body>
        <form action="资源分类.html"><!--表单标签定义--><!--action后面是提交地址-->
    <!--提交方式默认是get --><!--这样设置提交方式 <form action="资源分类.html" method="post"> post信息在请求体里面-->
            <br><br>
            &nbsp;&nbsp;手机号码: &nbsp;<input type="text" name="phone"/></br></br>
            &nbsp;&nbsp;密码输入: &nbsp;<input type="password" name="password"/></br></br>
            &nbsp;&nbsp;&nbsp;&nbsp;女:<input type="radio" name="sex" value="nv" />&nbsp;&nbsp;男:&nbsp;<input type="radio" name="sex" value="nan" 
            selected="selected"/></br></br> <!--性别标记 name 也必须相同-->
            爱好:&nbsp;<input type="checkbox" name="se" value="l" />篮球&nbsp;<input type="checkbox" name="se" value="p" />排球</br></br><!--name必须相同-->
            <input type="file"/></br></br>
            出生年月: <select name="birth">
                <option value="0">年</option>
                <option value="1997"/>1997</option>
                <option value=1998/>1998</option>
                <option value=1999/>1999</option>
            </select></br></br>
            只我介绍:</br><textarea rows="10" cols="50" name="selfinf"></textarea></br></br>
            &nbsp;&nbsp;&nbsp;&nbsp;<input type="submit"/><!--或者<input type=image src="路径" />-->
        </form>
    </body>
</html>