、基本概念:

CGI(Common Gate Interface,通用网关接口)

HTML均是静态网页,它无法实现一些复杂的功能,而CGI可以为我们实现。

get方式提交表单:

当表单被发送到服务器断后,表单中的数据被保存在服务器上一个叫做QUERY_STRING的环境变量中。这种表单的处理相对简单,只要读取环境变量就可以了。

post方式提交表单:

对于POST类型的表单,其内容被送到CGI程序的标准输入,而被传送的长度被放在环境变量 CONTENT_LENGTH中。因而我们要做的就是,在标准输入中读入CONTENT_LENGTH长度的字符串。

、http

2.1  http协议

HTTP是Hyper Text Transfer Protocol(超文本传输协议),其结构如下图所示。

2.2  HTTP组成

http请求由三部分组成,分别是:请求行、消息报头、请求正文

HTTP请求数据举例:

HTTP应答数据举例

2.3  http编码
form的enctype属性为编码方式,常用有两种:application/x-www-form-urlencoded和multipart/form-data,默认为application/x-www-form-urlencoded。
当action为get时候,浏览器用x-www-form-urlencoded的编码方式把form数据转换成一个字串(name1=value1&name2=value2...),然后把这个字串append到url
后面,用?分割,加载这个新的url。当action为post时候,浏览器把form数据封装到http body中,然后发送到server。
在网页中将表单进行上传的时候,就会进行编码,例如我们点击保存的时候。下图就是我是使用colasoft,科来抓包软件抓取的结构,当然你也可以使用wireshark进行抓取。

、网页设计

在javascript中,完成中英文切换,并且在实现同一个框架中不同页面之间的访问。

//标志位,用于后面的判断

var isEng=false;

//创建中文和英文数组

tree_en=new Arrary(“hello world”,”welcome to China”);

tree_en=new Arrary(“你好”,”欢迎”);

function changeLanguage()

{

//获取表单

var cf = document.forms[];

isEng = !isEng;

//更改框架中顶层按键中的按键值

document.all.language.value= isEng ? "中文" : "English";

var i=,j=;

//chrome浏览器不支持在本地使用parent.xxx类似的操作,而firefox支持。

//在服务器中两种浏览器都支持该操作。下面的语句作用是获取父框架左边的的网页。

//下面几条语句都可以在一个框架中的网页中访问另外一个框架中的数据。

//var frame_left = window.parent["left"];

var obj=window.parent.frame_left;

//var obj=parent.frame_left;

var cf=obj.contentWindow.document;

//cf.getElementById("AllOpen_1").innerHTML="hello";

//更改tree

var tree_arr=cf.getElementsByTagName("a");

var length=tree_arr.length;

//tree_text引用,这里就完成了中英文切换。tree_text根据isEng这个标志位的不同指向 //不同的数组,在更改网页中的内容就行了。后面要怎么操作就随自己了。

var tree_text=isEng?tree_en:tree_ch;

for(i=;i<length;i++)

{

tree_arr[i].innerHTML=tree_text[i];

}

//获取url中的文件名称

function getFileName(hr){

  var url = hr.location.href

//  var url = this.location.href

  var pos = url.lastIndexOf("/");

  if(pos == -){

   pos = url.lastIndexOf("\\")

  }

  var filename = url.substr(pos +)

  return filename;

}

http和网页设计的更多相关文章

  1. Httpster –世界各地最潮的网页设计案例聚合网站

    Httpster 这个网站聚合了世界各地最新最潮的网页设计案例,展示了创意的设计,精心的策划,优秀的排版.这些作品都按月份和类别进行了很好划分,你可以方便的找到自己感兴趣的网站案例. 立即去看看 您可 ...

  2. 自适应网页设计(Responsive Web Design)

    引用:http://www.ruanyifeng.com/blog/2012/05/responsive_web_design.html 随着3G的普及,越来越多的人使用手机上网. 移动设备正超过桌面 ...

  3. 手机web——自适应网页设计(html/css控制)

    一. 允许网页宽度自动调整: "自适应网页设计"到底是怎么做到的? 其实并不难. 首先,在网页代码的头部,加入一行viewport元标签. <meta name=" ...

  4. 15个前卫的 HTML5 & CSS3 网页设计作品

    今天,我们编译收集一组使用 HTML5 和 CSS3 制作的精美网站.在此集合中,你可以看到平面设计,网页设计,作品集和企业网站设计实例. 响应式设计和基于 HTML5 & CSS3 编码的网 ...

  5. 经典网页设计:20个与众不同的国外 HTML5 网站

    大家都都知道, HTML5 具备所有最新的技术和功能,帮助我们创造平滑过渡,花式图像滑块和动画.如果你正在考虑使用HTML5 来设计自己的网站,那么这个集合能够帮助你. 在过去的10年里,网页设计师使 ...

  6. 经典网页设计:20个华丽的 iPhone 应用程序演示网站

    一个物品销售很好,重要的原因之一是它的包装,因为这是最重要的细节,可以把一个人转变成购买者.一个好的包装设计和良好的表现比产品本身更重要,因此被分配了大量的金钱和资源,以创造伟大的东西. 因此,为了销 ...

  7. FROONT – 超棒的可视化响应式网页设计工具

    FROONT 是一个基于 Web 的设计工具,在浏览器中运行,使得各类可视化设计的人员都能进行响应式的网页设计,即使是那些没有任何编码技能的设计师.FROONT 使得响应式网页设计能够可视化操作,能够 ...

  8. PS网页设计教程——30个优秀的PS网页设计教程的中文翻译教程

    PS网页设计教程--30个优秀的PS网页设计教程的中文翻译教程   作为编码者,美工基础是偏弱的.我们可以参考一些成熟的网页PS教程,提高自身的设计能力.套用一句话,"熟读唐诗三百首,不会作 ...

  9. 韩国网页设计资料《网页设计大师2》JPG+PSD+TXT等 73.89G 百度云下载

    < 网页设计大师2 >超越第一代版本,提供更新更精美的网页素材模板.全部由国际顶级设计师精选打造,完全展示走在潮流 之前的设计风格.是网页设计师/UI交互界面设计师必备工具. < 网 ...

  10. HTML5+CSS3的响应式网页设计:自动适应屏幕宽度

    这几天都在修改博客上面的样式.本来用的是d83.0的模板.自己又修改了许多地方,其中自己修改的一些地方在手机里面显示的效果不是很理想,于是想改成自适应的效果.对CSS3不是特别的熟练,只能去网上找找案 ...

随机推荐

  1. Http中涉及到的知识点总结

    1.URL地址 协议-> HTTP:超文本传输协议,除了用来传输文本,还可以传输HTML页面.CSS文件.JS文件.图片.音视频... HTTPS:SSL,它比HTTP更加安全一些 FTP:文件 ...

  2. winform学习2-datagridview数据绑定

    1.datagridview.clearSelection()清除默认的选中项 2.列数据显示,首先列必须是显示状态, 3.布局-单元格内文字内容居中显示,示例:外观-defaultCellStyle ...

  3. Java栈与堆一篇好文

    http://blog.csdn.net/zhangao0086/article/details/6347342

  4. optimize table table_name myisam mysql自动清除删除过留下的空记录

    optimize table table_name 这个可以清除你表里面的空记录,每次清除的时候记得锁表 lock tables table_name  write|read; unlock tabl ...

  5. Apache Spark源码走读之18 -- 使用Intellij idea调试Spark源码

    欢迎转载,转载请注明出处,徽沪一郎. 概要 上篇博文讲述了如何通过修改源码来查看调用堆栈,尽管也很实用,但每修改一次都需要编译,花费的时间不少,效率不高,而且属于侵入性的修改,不优雅.本篇讲述如何使用 ...

  6. PHP 错误与异常 笔记与总结(14 )记录和发送异常信息

    当发生异常时,把异常信息记录到日志文件中: <?php header('content-type:text/html; charset=utf-8'); class LogException e ...

  7. ThinkPHP 学习笔记 ( 二 ) 控制器 ( Controller )

    /** * ThinkPHP version 3.1.3 * 部署方式:应用部署 * 文内的 http://localhost/ 由实际主机地址代替 */ 入口文件 index.php: <?p ...

  8. 开放平台鉴权以及OAuth2.0介绍

    OAuth 2.0 协议 OAuth是一个开发标准,允许用户授权第三方网站或应用访问他们存储在另外的服务提供者上的信息,而不需要将用户名和密码提供给第三方网站或分享他们数据的内容. OAuth 2.0 ...

  9. JNDI学习总结(三)——Tomcat下使用Druid配置JNDI数据源

    com.alibaba.druid.pool.DruidDataSourceFactory实现了javax.naming.spi.ObjectFactory,可以作为JNDI数据源来配置. 一.下载D ...

  10. 嵌入式Linux的FTP服务端软件(stupid-ftpd)

    我自己试没成功 http://blog.csdn.net/gzshun/article/details/7358651