资讯专栏INFORMATION COLUMN

#WEB安全基础 : HTML/CSS | 0x10实现交互_表单

lwx12525 / 2525人阅读

摘要:黑体先看看表单如何工作吧黑体请求黑体响应黑体简要工作流程黑体浏览器加载页面黑体用户输入数据黑体用户提交表单黑体服务器响应黑体概念都清楚了,我们来写表单吧黑体只有一个文件黑体这是显示黑体你

先看看表单如何工作吧


请求

 


响应

 


简要工作流程:

  1. 浏览器加载页面

  2. 用户输入数据

  3. 用户提交表单

  4. 服务器响应


概念都清楚了,我们来写表单吧


只有一个html文件

 
这是显示  

你可以向空白框框里写一些东西,然后点击提交

数据会发到web服务器的contest.php里,当然了,你也可以自己写一个php文件


下面是index.htm的l代码


DOCTYPE html>
<html>
<head>
<meta charset = "utf-8">
<title>TESTtitle>
head>
<body>

<form action = "http://wickedlysmart.com/hfhtmlcss/contest.php" method = "POST">    
<p>Jsut type in your name (and click Submit) to enter the contest:
<br>
First name : <input type = "text" name = "firstname" value = "">    
<br>
Last name: <input type = "text" name = "lastname" value = "">
<br>
<input type = "submit" value = "提交">    
form>
body>
html>

有关于HTTP协议,请等待我的教程,或者去看别人的也可以


深度解析一下

http://wickedlysmart.com/hfhtmlcss/contest.php" method = "POST">这个元素

form代表表单的开始

/form代表表单的结束

http://wickedlysmart.com/ 代表web服务器的URL

hfhtmlcss 代表脚本所在的文件夹

contest.php 代表脚本的文件名

method = "POST" 决定表单数据如何发送给服务器


//本系列教程基于《Head First HTML与CSS(第二版)》,此书国内各大购物网站皆可购买


转载请注明出处  by:M_ZPHr

最后修改日期:2019-01-19

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/1297.html

相关文章

  • #WEB安全基础 : HTML/CSS | 文章索引

    摘要:黑体本系列讲解安全所需要的和黑体安全基础我的第一个网页黑体安全基础初识黑体安全基础初识标签黑体安全基础文件夹管理网站黑体安全基础模块化黑体安全基础嵌套列表黑体安全基础标签拓展和属性的使用黑体安全基础嵌套本系列讲解WEB安全所需要的HTML和CSS #WEB安全基础 : HTML/CSS | 0x0 我的第一个网页 #WEB安全基础 : HTML/CSS | 0x1初识CSS #WEB安全基...

    EscapedDog 评论0 收藏0
  • HTMLCSS基础 {未完待续}

    摘要:表单能够包含元素,比如文本字段复选框单选框提交按钮等等。表单属性表单用于接收不同类型的用户输入,用户提交表单时向服务器传输数据,从而实现用户与服务器的交互。 标签 超链接(需要在新的浏览器窗口中打开时使用target) 点我 本页跳转 顶部 ................................ 返回顶部 标签还有一个作用是可以链接Email地址.便捷发送邮件。 发送 mai...

    李涛 评论0 收藏0
  • HTMLCSS基础 {未完待续}

    摘要:表单能够包含元素,比如文本字段复选框单选框提交按钮等等。表单属性表单用于接收不同类型的用户输入,用户提交表单时向服务器传输数据,从而实现用户与服务器的交互。 标签 超链接(需要在新的浏览器窗口中打开时使用target) 点我 本页跳转 顶部 ................................ 返回顶部 标签还有一个作用是可以链接Email地址.便捷发送邮件。 发送 mai...

    张利勇 评论0 收藏0
  • 前端工程师的知识体系

    摘要:目前只有和有这个概率。是快速开发应用程序的前端工具包。调试工具前端的调试工具很多,比如,核心的的。前端流程部署,和现在几乎是前端最流行的自动化的项目构建工具正则表达式浏览器插件开发浏览器原理沟通能力优秀 下图是前端工程师图解:showImg(http://upload-images.jianshu.io/upload_images/1807893-de7c7404345922b6.jp...

    itvincent 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<