底什么是前端后端是什么,后台

做后端应该要会前端吗?
22:34:29 +08:00 · 5073 次点击
最近有一个公司招聘,要求了解前端,精通后台编码
然后就联想到以前有吐槽做后端的同时要求做前端的……感觉后端亚历山大啊……
26 回复 &| &直到
14:44:38 +08:00
& & 22:37:36 +08:00
只需要了解前后端交互吧
& & 22:38:20 +08:00
我是写后端的,前端虽然不专业,但是写个普通的页面,用个jquery,require.js,mvvm是没问题的
不大会出现前端一点不懂的情况吧
& & 22:38:52 +08:00
@ 我觉得你的程度已经蛮深的了……
& & 22:48:56 +08:00
起码基础知识要知道吧。
& & 22:51:06 +08:00
我也是后端, 但是到公司了给派前端的活了,就开始学了, 不难, 就是一个积累的过程
& & 22:55:16 +08:00
所以说,还是应该了解一点的,这样利于提高开发效率……get it!
& & 23:10:40 +08:00
@ 一点不懂的话怎么和前端的人吵架啊!:)逃
& & 23:11:39 +08:00
@ 简直太有道理了!我竟无言以对……
& & 23:17:00 +08:00 via iPhone
后端应该都多少会点前端的吧,尤其是用PHP,面试题你简直看不出来招的是前端还是后端
& & 23:38:28 +08:00
前端还是要会的,不然你怎样套程序啊。而且会前端便于接单子啊。而且我看过一些人,前端模板到手了,根本不知道怎样下手。
& & 00:53:16 +08:00
总觉得这种类型的苦恼大多应该是“做前端应该要会后端么”。
& & 00:55:03 +08:00
必须得会,只是不用精通
& & 00:55:34 +08:00
po主得了多学一点会死的病
& & 01:16:00 +08:00
web的话会了解,但徒手去写还是有点困难,属于撞大运法调试CSS... 遇到做鸡前端写的JS,你只能含泪重写。要是遇到HTML做的好 对后端也有考虑到,简直像哭着打电话说谢谢...
& & 06:38:47 +08:00 via iPhone
@ 太形象 撞大运法 css全是坑
& & 08:23:24 +08:00
@ 我写前端的时候会先看看后端童鞋的代码,适当调整一下代码风格和命名习惯,并且还会问一下一些借口的命名和用法。水平有限,唯恐坑了人家。
& & 09:45:33 +08:00
(假设)我作为一个公司老板,我肯定希望我招聘的员工既会前端又会后端,这样我就可以省一大笔了啊。2333
ps: 作为一个后端,表示你至少还是要会点基本的。
& & 09:51:29 +08:00
这个问题反过来也也一样
前端也要懂点后端,个人觉得PHP和mysql就够了
& & 09:54:25 +08:00
前端和后端的交互原理一定要烂熟于心,不然很容易被人给忽悠了!而且要分清楚前端和后端相应的职责。防止被人忽悠。
& & 09:55:36 +08:00
不会怎么做CTO
& & 11:05:18 +08:00
也和你一样的情况,难受死。
然后过渡到直接玩前端,玩了这么久,其实发现前端的水真的更深,现在准备换种语言玩耍。
& & 11:37:18 +08:00
表示个人觉得前段也是PHP的必修课啊。
& & 12:20:30 +08:00
会搬砖也要会砌砖。
& & 12:36:20 +08:00
表示后端一半时间以上在写前端,你要的东西说半天前端也写不完,不如自己撸袖子上
& & 15:47:10 +08:00
@ 哈哈哈,我是一大半时间都是写前台上了。。。
& & 14:44:38 +08:00
前段、后端、桌面客户端、搜索引擎、数据库、ETL、数据扩展、业务扩展、产品经理、招聘经理都在做,挺好的(心里默默流下眼泪...)
& · & 1933 人在线 & 最高记录 3541 & · &
创意工作者们的社区
World is powered by solitude
VERSION: 3.9.8.0 · 46ms · UTC 12:04 · PVG 20:04 · LAX 05:04 · JFK 08:04? Do have faith in what you're doing.底什么是前端后端,后台_百度知道
底什么是前端后端,后台
我有更好的答案
后端、后台我说的是软件技术开发上的前端。不一定专业:一般指管理员可操作的一个平台。不同产品后台不一样。可能是查看数据的后台:一般指客户端。就是用户使用的软件。如QQ,微信操作的软件均属于前端,但供参考。前端。就是构建整套互联网服务的部分。如QQ,微信都有IM服务器,就属于后端。后台。后端:一般指服务端
采纳率:34%
2、AJAX是异步通信的一种技术,主要实现技术是javascript+xml+html+css+服务端。在这里主要讨论客户端的操作1、前端和后端,前台和后台前端和后端指的是客户端和服务器端;前台和后台指的都是客户端上浏览者浏览界面和管理者管理界面
前端:你所看到的网页页面,包括控件布局,色调,字体,控件响应等等,技术层面上前端=HTML+CSS+JAVASCRIPT后端就是网站的逻辑部分,主要涉及数据库,动态语言如PHP、ASP、JSP等后台一般指的是管理员操作模块,包括对网站内容的更新、注册会员管理等等,是网站的一个子模块
为您推荐:
其他类似问题
您可能关注的内容
换一换
回答问题,赢新手礼包
个人、企业类
违法有害信息,请在下方选择后提交
色情、暴力
我们会通过消息、邮箱等方式尽快将举报结果通知您。前台和后台,前端和后端
我的图书馆
前台和后台,前端和后端
& & & & 学习AJAX的过程中,发现自己之前存在着很多的不足,于是花了些时间,总结了一些知识,现在和大家分享一下。
前端和后端,前台和后台
& & & &&前端和后端指的是客户端和服务器端;前台和后台指的都是客户端上浏览者浏览界面和管理者管理界面。
get和post方法
& & & & 客户端和服务器端进行数据的传递通过的都是get方法或者post方法。get方法的数据会留在浏览器中新返回页面的url里面;post方法中的数据在浏览器的请求包内的数据内容里面,服务器接收后,如果没有对齐进行处理,那么我们就无法在返回页面中找到相应的数据。
& & & &单纯的说脚本太抽象,从电影的角度说:电影后期编辑时,编辑师根据脚本对拍摄的影像进行剪切,排版,加入特效等等相应的操作;从计算机语言的角度说:HTML文档后期运行时,浏览器根据脚本(客户端脚本)对HTML进行相应动态的处理和显示。具体让我用一句话来说的话,脚本就是可以加工成型东西的机制。
纯HTML页面之间数据传递和使用
& & & & 叙述
& & & & & & & &单单使用html标签进行数据的传递和使用(特指)是不可能实现的,所以,这里说的“纯”是可以有客户端脚本的HTML页面,当然,另一个隐含的意思就是,这里没有后台脚本等等的参与,所以,你直接把数据提交给服务器,这个方法是不管用的,也就是说post方法不可以实现纯HTML页面之间数据传递(可以)和使用(不可以),在这里本人也会给出相应post方法的数据传递的实现代码,好了,接着说本块的这个话题。
& & & & & & & & 如何实现这个该功能呢?有什么方法呢?一个思路是通过get方法;另一个思路是通过浏览器中的cookie。
& & & &通过get方法& &&
& & & & & & & & 传递数据的页面代码(通过3种方法实现,其它的大家自己再想一想,本句不再重复)
&!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1-transitional.dtd"&
&meta http-equiv="content-type" content="text/charset=utf-8"&
&title&利用链接标签a手动拼接url&/title&
&a href="获得url中的参数.html?name=qingshan&sex=man"&链接&/a&
&!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1-transitional.dtd"&
&meta http-equiv="content-type" content="text/charset=utf-8"&
&title&利用javascript手动拼接url&/title&
&script type="text/javascript"&
//JavaScript中写window.open("test3.html?name=qingshan&key=qingshan");弹出窗口一般不行
function Post(){
url="获得url中的参数.html?name=" + encodeURI(document.getElementById("name").value);
//页面跳转,并在url中传递数据
location.href=
//location为对象
//window.location.href=
location为对象
//window.location= location为属性
//document.location=
&input type="text" name="name" id="name"/&
&input type="submit" value="提交" onclick="javascript:Post();" /&
&!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&
&html xmlns="http://www.w3.org/1999/xhtml" /&
&meta http-equiv="Content-Type" content="text/ charset=utf-8" /&
&title&利用form表单自动拼接url&/title&
&!--浏览器会自动在url后面加上相应的值,形如:test.html?name=数值&sex=数值--&
&form method="get" action="获得url中的参数.html"&
姓名:&input type="text" name="name" /&
性别:&input type="text" name="sex" /&
&input type="submit" value="提交" /&
& & & & & & & & 接收并显示数据
&!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&
&html xmlns="http://www.w3.org/1999/xhtml" /&
&meta http-equiv="Content-Type" content="text/ charset=utf-8" /&
&title&获得url中的参数&/title&
&script type="text/javascript"&
1、从 URL 字符串中提取变量的值
2、字符串对象的indexof(),substr(),split(),toUpperCase()方法
function Request(strName){
//BOM对象 获取当前页面的url
var strHref = window.document.location.
//字符串对象的方法 获取参数字符串开始的位置
var intPos = strHref.indexOf("?");
//取出参数字符串
var strRight = strHref.substr(intPos + 1);
//将多个参数,按照“&”进行分割
var arrTmp = strRight.split("&");
for(var i = 0; i & arrTmp. i++){
//将一个参数字符串按照“=”分割成:参数名和参数值
var arrTemp = arrTmp[i].split("=");
if(arrTemp[0].toUpperCase() == strName.toUpperCase())
return arrTemp[1];
return "";
search方法
function Request(sPan){
var sQuery = document.location.
if(sQuery.indexOf("?") == 0)
sQuery = sQuery.substr(1);
if(sQuery.indexOf("&") &= 0){
var aQuery = sQuery.split("&");
var sTempQ
for (var nTempCount = 0; nTempCount & aQuery. nTempCount++){
sTempQuery = aQuery[nTempCount];
if (sTempQuery.indexOf("=") &= 0){
if (sTempQuery.substring(0,sTempQuery.indexOf("=")) == sPan){
//return deCodeURI(sTempQuery.substr(sTempQuery.indexOf("=") + 1));
JavaScript脚本
return sTempQuery.substr(sTempQuery.indexOf("=") + 1);
if (sQuery.indexOf("=") &= 0){
if (sQuery.substring(0,sQuery.indexOf("=")) == sPan){
//return decodeURI(sQuery.substr(sQuery.indexOf("=") + 1));
JavaScript脚本
return sQuery.substr(sQuery.indexOf("=") + 1);
&form method=get action="test3.htm" name="myform"&
&input type="text" name="name" value="请在文本输入框里输入内容" /&
&input type="submit" value="提交" /&
&script type="text/javascript"&
//页面加载完成后自动运行下面的代码
Rtext=Request("name")
if(Rtext!=""){
myform.name.value=R
& & & &通过浏览器cookie
& & & & & & & &传送数据
&!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1-transitional.dtd"&
&meta http-equiv="content-type" content="text/charset=utf-8"&
&title&发送数据&/title&
&script type="text/javascript"&
//传送的数据赋值到cookie中
function setCookie(name,value,path) //两个参数,一个是cookie的名子,一个是值
//var Days = 30;
//此 cookie 将被保存 30 天
= new Date();
//new Date()("December 31, 9998");
//exp.setTime(exp.getTime() + Days*24*60*60*1000);
//document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
//document.cookie = name + "="+ escape (value) + ";expires=";
//escape()及unescapte()方法已过时,现使用encodeURI()和decodeURI()
document.cookie = name + "="+ encodeURI(value) + ";path="+path+";expires=";
//从cookie中取出相应的值
function getCookie(name)
var arr = document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)"));
if(arr != null)
return decodeURI(arr[2]);
}catch(err){
//删除cookie中相应的值
function delCookie(name)
var exp = new Date()();
exp.setTime(exp.getTime() - 1);
var cval=getCookie(name);
if(cval!=null)
document.cookie= name + "="+cval+";expires="+exp.toGMTString();
//往cookie中添加传送数据
setCookie("name","青山");
&a href="ReadCookie.html"&跳转&/a&
& & & & & & & &显示数据
&!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1-transitional.dtd"&
&meta http-equiv="content-type" content="text/charset=utf-8"&
&title&显示数据&/title&
&script type="text/javascript"&
//往cookie中添加传送的数据
function setCookie(name,value,path) //两个参数,一个是cookie的名子,一个是值
//var Days = 30;
//此 cookie 将被保存 30 天
= new Date();
//new Date()("December 31, 9998");
//exp.setTime(exp.getTime() + Days*24*60*60*1000);
//document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
//document.cookie = name + "="+ escape (value) + ";expires=";
//escape()及unescapte()方法已过时,现使用encodeURI()和decodeURI()
document.cookie = name + "="+ encodeURI(value) + ";path="+path+";expires=";
//从cookie中取出相应的值
function getCookie(name)
//正则表达式的运用
var arr = document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)"));
if(arr != null)
//避免中文乱码问题
return decodeURI(arr[2]);
}catch(err){
//删除cookie中相应的值
function delCookie(name)
var exp = new Date();
exp.setTime(exp.getTime() - 1);
var cval=getCookie(name);
if(cval!=null)
document.cookie= name + "="+cval+";expires="+exp.toGMTString();
//从cookie中获得数据
alert(getCookie("name"));
//删除数据
delCookie("name");
alert("删除?" + getCookie("name"));
& & & &post方法提交数据
& & & & & & & 对于HTML中书写form标签的方法在这里就不写了,下去有兴趣的读者可以自己写一下。下面用的方法是通过Javascript创建节点的方法,具体如下
&!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1-transitional.dtd"&
&meta http-equiv="content-type" content="text/charset=utf-8"&
&title&模板&/title&
&script type="text/javascript"&
function addForm(){
//创建form标签,并设置相应的属性
var fatherForm = document.createElement("form");
fatherForm.method="post";
//可以设置为get
fatherForm.action="a.html";
//创建第一个input标签,并设置相应的属性
var firstInput = document.createElement("input");
firstInput.type="hidden";
//child1.setAttribute("type","text");
firstInput.name="name";
firstInput.value="青山";
//创建第二个input标签,并设置相应的属性
var secondInput = document.createElement("input");
secondInput.type="hidden";
secondInput.name="sex";
secondInput.value="男";
//将创建的input的节点添加到form标签里
fatherForm.appendChild(firstInput);
fatherForm.appendChild(secondInput);
//将创建的form节点添加到body标签里
//document.getElementById("body").appendChild(father);
document.body.appendChild(fatherForm);
//提交表单
fatherForm.submit();
&body id="body"&
&input type="button" value="input" onclick="javascript:addForm();"/&
& & & & & & & & & & & &对于post的方法的验证,可以逐步的做,可以先显示创建的节点,然后通过工具查看相应的请求(post或get)
ASP.net页面之间的跳转
& & & & asp.net页面之间的跳转有多种思路。思路一:客户端直接进行跳转工作;思路二:服务器端执行相应的服务器端代码进行相应的跳转工作;思路三:浏览器执行服务器端返回的脚本进行跳转。
& & & &三种思路,每一种思路都有很多具体的实现,例如:上面get和post就是一些具体的方法。在这里只写一些本人认为重点的内容
不需要执行服务器端代码
1、有javascript参与
1、location.href="跳转后的页面.html";
2、window.location="跳转后的页面.html";
3、window.location.href="跳转后的页面.html";
4、document.location="跳转后的页面.html";
1、window.open("跳转后的页面.html");
2、表单提交方法
2、无javascript参与
1、&a href="http://www.baidu.com?name=青山&sex=男"&跳转到百度&/a&
2、&form method="get" action="跳转后的页面.html"&&/form& &!--method可以为post--&
只需要执行服务器端代码
1、response.redirect("answer.aspx?name=aaa&sex=bbb");
//注意,这个可能是第三种情况
2、server.transfer("answer.aspx?name=aaa&sex=bbb");
3、server.execute("answer.aspx?name=aaa&sex=bbb");
response.redirect():没有站点限制(可以由雅虎服务器跳到新浪服务器);速度慢;当前url显示的路径改变;
transfer()和execute():只能进行站内页面跳转(同一台服务器上);速度快;当前url显示的路径不变;
redirect():可实现*.aspx页面跳转到其它类型页面
transfer():只能进行*.aspx页面之间跳转
execute():把aspx页面上的内容插入到另一个aspx页面最后面
需要服务端和客户端都执行脚本
通过使用Response.Write方法有多种具体的实现,在这里就不写了
1、Response.Write("&script type='text/javascript'&window.open('aaa.aspx?name=qingshan&sex=man');&/script&");
很多浏览器禁止窗口的弹出窗体;目标页面和原页面可以在2个服务器上,原窗口保留,另外新增一个新页面
2、Response.Write("&script type='text/javascript'& window.location='aaa.aspx?name=qingshan&sex=man';&/script&");
新打开的页面,原窗口被代替
asp.net页面之间数据的传递
& & & & 客户端和服务器端进行数据的交流都是通过post方法或者get方法,这一点在前面也说了,之所以在这里再说,是为了让大家明白清楚,下面的内容。
&runat="server" 的意思就是变成控件,变成asp.net的控件,标签元素和控件是不同的东西,在服务器端,控件会进行一个处理,生成具有一些标志的标签元素,然后返回给浏览器,浏览器和服务器端进行交互的时候,都会把这些具有特殊标志的标签元素的所有特性给传过来
& & & &asp.net服务器端控件会在客户端请求的时候,被服务器变成标签元素返回给浏览器,浏览器每次和服务器进行交互的时候,都会把这些标签的state返回给服务器端,然后,服务器端解析这些状态,看看是否有相应事件的触发,当然,我们也可以通过后端代码访问这些数据,因为这些数据包含了该“控件”的所有信息,所以,有时会使我们对post和get方法在这里的作用有些迷茫,其实,这些数据都是通过post方法或者get方法实现传递的,至于服务器端是如何解析数据并执行的,我们现在不用管。
& & & &一个小测试,说明服务端控件传送state信息。
&form id="form1" runat="server" method="get"&
&asp:Button ID="Button1" runat="server" Text="测试" onclick="Button1_Click" /&
protected void Button1_Click(object sender, EventArgs e)
Response.Write("测试内容");
结果(方便大家看,这里用的为get方法)
& & & & 接着说我们ASP.net页面之间数据传输的问题,这里具体的代码就不写了,说一下思路。思路一:前台为主;思路二:后台为主。具体的东西大家可以看一下别人的东西吧!下面是我copy张世栋并简单做了一些修改的东西,大家可以看看
1. 使用QueryString变量
QueryString是一种非常简单的传值方式,他可以将传送的值显示在浏览器的地址栏中。但是对于传递数组或对象的话,就不能用这个方法了。
//ask.aspx的代码
protected void Button1_Click(object sender,EventArgs e)
//传递的参数包含在URL中,URL的长度有限制
Response.Redirect("answer.aspx?name=天天");
//answer.aspx中代码
protectedvoid Page_Load(object sender, EventArgs e)
Response.Write(Request.QueryString["name"]);
2. 使用Application 对象变量
Application对象的作用范围是整个全局,也就是说对所有用户都有效。其常用Lock和UnLock方法来对application对象进行锁定,防止多个用户同时对次此对象进行操作,造成数据混乱。
//ask.aspx的代码
private void Button1_Click(object sender, System.EventArgs e)
//类似与哈希表
Application["name"] = "天天";
//使用Server.Transfer跳转页面的时候浏览器显示的地址并没有改变
Server.Transfer("answer.aspx");
//answer.aspx中代码
private void Page_Load(object sender, EventArgs e)
Application.Lock();
Response.Write(Application["name"].ToString());
Application.UnLock();
3. 使用Session变量
其操作与Application类似,作用于用户个人,所以,过量的存储会导致服务器内存资源的耗尽。
//ask.aspx的代码
private void Button1_Click(object sender, System.EventArgs e)
Session["name"] = "天天";
Response.Redirect ("answer.aspx");
//answer.aspx中代码
private void Page_Load(object sender, EventArgs e)
Response.Write(Session["name"].ToString());
4. 使用Cookie对象变量
与Session一样,对每一个用户而言的,Cookie是存放在客户端的,而session是存放在服务器端的。而且Cookie的使用要配合ASP.NET内置对象Request来使用
//ask.aspx的代码
private void Button1_Click(object sender, System.EventArgs e)
HttpCookiecookieTest = new HttpCookie("name"); //创建cookie对象
cookieTest.Value ="天天";
//给cookie对象赋值
Response.AppendCookie(cookieTest);
//保存cookies对象(response.Cookie.Add(CookieName);)
erver.Transfer("answer.aspx");
//answer.aspx中代码
private void Page_Load(object sender, EventArgs e)
HttpCookie MyCookie= Request.Cookies["name"];//获取Cookie对象
String StrName =MyCookie.V
//获取其变量值
Response.Write(StrName);
5. 使用cache缓存的方式
缓存存在的时间不是太长所以需要慎重使用
//ask.aspx的代码
protected void Button1_Click(object sender,EventArgs e)
this.Cache.Insert("name", "天天");
Server.Transfer("answer.aspx");
//answer.aspx中代码
protectedvoid Page_Load(object sender, EventArgs e)
Response.Write(Cache["name"].ToString());
6. 使用Server.Transfer方法
这个才可以说是面象对象开发所使用的方法,其使用Server.Transfer方法把流程从当前页面引导到另一个页面中,新的页面使用前一个页面的应答流,所以这个方法是完全面象对象的,简洁有效。
//ask.aspx的代码
public string name
return "天天";
private void Button1_Click(object sender, System.EventArgs e)
Server.Transfer("answer.aspx");
//answer.aspx中C#代码
private void Page_Load(object sender, EventArgs e)
ask a = new ask();
string StrName
Response.Write(StrName);
& & & & 方法不仅仅只有上面那些,还有很多种,有兴趣的读者,可以继续做下去。
& & & &本篇博客主要写的内容为:静态HTML之间页面的转化;静态HTML之间数据的传递;ASP.net页面之间的转化;ASP.net页面之间数据的传递;静态HTML和ASP.net页面之间的交互。里面的有些内容可能不是做了为一个模块来讲,但是,可以从别的模块中得到,所以在上面的描述中就没有再重复的写了,另外,在静态HTML和ASP.net页面之间交互的解释非常的少,
& & & & 学习AJAX的过程中,发现自己之前存在着很多的不足,于是花了些时间,总结了一些知识,现在和大家分享一下。
前端和后端,前台和后台
& & & &&前端和后端指的是客户端和服务器端;前台和后台指的都是客户端上浏览者浏览界面和管理者管理界面。
get和post方法
& & & & 客户端和服务器端进行数据的传递通过的都是get方法或者post方法。get方法的数据会留在浏览器中新返回页面的url里面;post方法中的数据在浏览器的请求包内的数据内容里面,服务器接收后,如果没有对齐进行处理,那么我们就无法在返回页面中找到相应的数据。
& & & &单纯的说脚本太抽象,从电影的角度说:电影后期编辑时,编辑师根据脚本对拍摄的影像进行剪切,排版,加入特效等等相应的操作;从计算机语言的角度说:HTML文档后期运行时,浏览器根据脚本(客户端脚本)对HTML进行相应动态的处理和显示。具体让我用一句话来说的话,脚本就是可以加工成型东西的机制。
纯HTML页面之间数据传递和使用
& & & & 叙述
& & & & & & & &单单使用html标签进行数据的传递和使用(特指)是不可能实现的,所以,这里说的“纯”是可以有客户端脚本的HTML页面,当然,另一个隐含的意思就是,这里没有后台脚本等等的参与,所以,你直接把数据提交给服务器,这个方法是不管用的,也就是说post方法不可以实现纯HTML页面之间数据传递(可以)和使用(不可以),在这里本人也会给出相应post方法的数据传递的实现代码,好了,接着说本块的这个话题。
& & & & & & & & 如何实现这个该功能呢?有什么方法呢?一个思路是通过get方法;另一个思路是通过浏览器中的cookie。
& & & &通过get方法& &&
& & & & & & & & 传递数据的页面代码(通过3种方法实现,其它的大家自己再想一想,本句不再重复)
&!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1-transitional.dtd"&
&meta http-equiv="content-type" content="text/charset=utf-8"&
&title&利用链接标签a手动拼接url&/title&
&a href="获得url中的参数.html?name=qingshan&sex=man"&链接&/a&
&!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1-transitional.dtd"&
&meta http-equiv="content-type" content="text/charset=utf-8"&
&title&利用javascript手动拼接url&/title&
&script type="text/javascript"&
//JavaScript中写window.open("test3.html?name=qingshan&key=qingshan");弹出窗口一般不行
function Post(){
url="获得url中的参数.html?name=" + encodeURI(document.getElementById("name").value);
//页面跳转,并在url中传递数据
location.href=
//location为对象
//window.location.href=
location为对象
//window.location= location为属性
//document.location=
&input type="text" name="name" id="name"/&
&input type="submit" value="提交" onclick="javascript:Post();" /&
&!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&
&html xmlns="http://www.w3.org/1999/xhtml" /&
&meta http-equiv="Content-Type" content="text/ charset=utf-8" /&
&title&利用form表单自动拼接url&/title&
&!--浏览器会自动在url后面加上相应的值,形如:test.html?name=数值&sex=数值--&
&form method="get" action="获得url中的参数.html"&
姓名:&input type="text" name="name" /&
性别:&input type="text" name="sex" /&
&input type="submit" value="提交" /&
& & & & & & & & 接收并显示数据
&!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&
&html xmlns="http://www.w3.org/1999/xhtml" /&
&meta http-equiv="Content-Type" content="text/ charset=utf-8" /&
&title&获得url中的参数&/title&
&script type="text/javascript"&
1、从 URL 字符串中提取变量的值
2、字符串对象的indexof(),substr(),split(),toUpperCase()方法
function Request(strName){
//BOM对象 获取当前页面的url
var strHref = window.document.location.
//字符串对象的方法 获取参数字符串开始的位置
var intPos = strHref.indexOf("?");
//取出参数字符串
var strRight = strHref.substr(intPos + 1);
//将多个参数,按照“&”进行分割
var arrTmp = strRight.split("&");
for(var i = 0; i & arrTmp. i++){
//将一个参数字符串按照“=”分割成:参数名和参数值
var arrTemp = arrTmp[i].split("=");
if(arrTemp[0].toUpperCase() == strName.toUpperCase())
return arrTemp[1];
return "";
search方法
function Request(sPan){
var sQuery = document.location.
if(sQuery.indexOf("?") == 0)
sQuery = sQuery.substr(1);
if(sQuery.indexOf("&") &= 0){
var aQuery = sQuery.split("&");
var sTempQ
for (var nTempCount = 0; nTempCount & aQuery. nTempCount++){
sTempQuery = aQuery[nTempCount];
if (sTempQuery.indexOf("=") &= 0){
if (sTempQuery.substring(0,sTempQuery.indexOf("=")) == sPan){
//return deCodeURI(sTempQuery.substr(sTempQuery.indexOf("=") + 1));
JavaScript脚本
return sTempQuery.substr(sTempQuery.indexOf("=") + 1);
if (sQuery.indexOf("=") &= 0){
if (sQuery.substring(0,sQuery.indexOf("=")) == sPan){
//return decodeURI(sQuery.substr(sQuery.indexOf("=") + 1));
JavaScript脚本
return sQuery.substr(sQuery.indexOf("=") + 1);
&form method=get action="test3.htm" name="myform"&
&input type="text" name="name" value="请在文本输入框里输入内容" /&
&input type="submit" value="提交" /&
&script type="text/javascript"&
//页面加载完成后自动运行下面的代码
Rtext=Request("name")
if(Rtext!=""){
myform.name.value=R
& & & &通过浏览器cookie
& & & & & & & &传送数据
&!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1-transitional.dtd"&
&meta http-equiv="content-type" content="text/charset=utf-8"&
&title&发送数据&/title&
&script type="text/javascript"&
//传送的数据赋值到cookie中
function setCookie(name,value,path) //两个参数,一个是cookie的名子,一个是值
//var Days = 30;
//此 cookie 将被保存 30 天
= new Date();
//new Date()("December 31, 9998");
//exp.setTime(exp.getTime() + Days*24*60*60*1000);
//document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
//document.cookie = name + "="+ escape (value) + ";expires=";
//escape()及unescapte()方法已过时,现使用encodeURI()和decodeURI()
document.cookie = name + "="+ encodeURI(value) + ";path="+path+";expires=";
//从cookie中取出相应的值
function getCookie(name)
var arr = document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)"));
if(arr != null)
return decodeURI(arr[2]);
}catch(err){
//删除cookie中相应的值
function delCookie(name)
var exp = new Date()();
exp.setTime(exp.getTime() - 1);
var cval=getCookie(name);
if(cval!=null)
document.cookie= name + "="+cval+";expires="+exp.toGMTString();
//往cookie中添加传送数据
setCookie("name","青山");
&a href="ReadCookie.html"&跳转&/a&
& & & & & & & &显示数据
&!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1-transitional.dtd"&
&meta http-equiv="content-type" content="text/charset=utf-8"&
&title&显示数据&/title&
&script type="text/javascript"&
//往cookie中添加传送的数据
function setCookie(name,value,path) //两个参数,一个是cookie的名子,一个是值
//var Days = 30;
//此 cookie 将被保存 30 天
= new Date();
//new Date()("December 31, 9998");
//exp.setTime(exp.getTime() + Days*24*60*60*1000);
//document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
//document.cookie = name + "="+ escape (value) + ";expires=";
//escape()及unescapte()方法已过时,现使用encodeURI()和decodeURI()
document.cookie = name + "="+ encodeURI(value) + ";path="+path+";expires=";
//从cookie中取出相应的值
function getCookie(name)
//正则表达式的运用
var arr = document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)"));
if(arr != null)
//避免中文乱码问题
return decodeURI(arr[2]);
}catch(err){
//删除cookie中相应的值
function delCookie(name)
var exp = new Date();
exp.setTime(exp.getTime() - 1);
var cval=getCookie(name);
if(cval!=null)
document.cookie= name + "="+cval+";expires="+exp.toGMTString();
//从cookie中获得数据
alert(getCookie("name"));
//删除数据
delCookie("name");
alert("删除?" + getCookie("name"));
& & & &post方法提交数据
& & & & & & & 对于HTML中书写form标签的方法在这里就不写了,下去有兴趣的读者可以自己写一下。下面用的方法是通过Javascript创建节点的方法,具体如下
&!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1-transitional.dtd"&
&meta http-equiv="content-type" content="text/charset=utf-8"&
&title&模板&/title&
&script type="text/javascript"&
function addForm(){
//创建form标签,并设置相应的属性
var fatherForm = document.createElement("form");
fatherForm.method="post";
//可以设置为get
fatherForm.action="a.html";
//创建第一个input标签,并设置相应的属性
var firstInput = document.createElement("input");
firstInput.type="hidden";
//child1.setAttribute("type","text");
firstInput.name="name";
firstInput.value="青山";
//创建第二个input标签,并设置相应的属性
var secondInput = document.createElement("input");
secondInput.type="hidden";
secondInput.name="sex";
secondInput.value="男";
//将创建的input的节点添加到form标签里
fatherForm.appendChild(firstInput);
fatherForm.appendChild(secondInput);
//将创建的form节点添加到body标签里
//document.getElementById("body").appendChild(father);
document.body.appendChild(fatherForm);
//提交表单
fatherForm.submit();
&body id="body"&
&input type="button" value="input" onclick="javascript:addForm();"/&
& & & & & & & & & & & &对于post的方法的验证,可以逐步的做,可以先显示创建的节点,然后通过工具查看相应的请求(post或get)
ASP.net页面之间的跳转
& & & & asp.net页面之间的跳转有多种思路。思路一:客户端直接进行跳转工作;思路二:服务器端执行相应的服务器端代码进行相应的跳转工作;思路三:浏览器执行服务器端返回的脚本进行跳转。
& & & &三种思路,每一种思路都有很多具体的实现,例如:上面get和post就是一些具体的方法。在这里只写一些本人认为重点的内容
不需要执行服务器端代码
1、有javascript参与
1、location.href="跳转后的页面.html";
2、window.location="跳转后的页面.html";
3、window.location.href="跳转后的页面.html";
4、document.location="跳转后的页面.html";
1、window.open("跳转后的页面.html");
2、表单提交方法
2、无javascript参与
1、&a href="http://www.baidu.com?name=青山&sex=男"&跳转到百度&/a&
2、&form method="get" action="跳转后的页面.html"&&/form& &!--method可以为post--&
只需要执行服务器端代码
1、response.redirect("answer.aspx?name=aaa&sex=bbb");
//注意,这个可能是第三种情况
2、server.transfer("answer.aspx?name=aaa&sex=bbb");
3、server.execute("answer.aspx?name=aaa&sex=bbb");
response.redirect():没有站点限制(可以由雅虎服务器跳到新浪服务器);速度慢;当前url显示的路径改变;
transfer()和execute():只能进行站内页面跳转(同一台服务器上);速度快;当前url显示的路径不变;
redirect():可实现*.aspx页面跳转到其它类型页面
transfer():只能进行*.aspx页面之间跳转
execute():把aspx页面上的内容插入到另一个aspx页面最后面
需要服务端和客户端都执行脚本
通过使用Response.Write方法有多种具体的实现,在这里就不写了
1、Response.Write("&script type='text/javascript'&window.open('aaa.aspx?name=qingshan&sex=man');&/script&");
很多浏览器禁止窗口的弹出窗体;目标页面和原页面可以在2个服务器上,原窗口保留,另外新增一个新页面
2、Response.Write("&script type='text/javascript'& window.location='aaa.aspx?name=qingshan&sex=man';&/script&");
新打开的页面,原窗口被代替
asp.net页面之间数据的传递
& & & & 客户端和服务器端进行数据的交流都是通过post方法或者get方法,这一点在前面也说了,之所以在这里再说,是为了让大家明白清楚,下面的内容。
&runat="server" 的意思就是变成控件,变成asp.net的控件,标签元素和控件是不同的东西,在服务器端,控件会进行一个处理,生成具有一些标志的标签元素,然后返回给浏览器,浏览器和服务器端进行交互的时候,都会把这些具有特殊标志的标签元素的所有特性给传过来
& & & &asp.net服务器端控件会在客户端请求的时候,被服务器变成标签元素返回给浏览器,浏览器每次和服务器进行交互的时候,都会把这些标签的state返回给服务器端,然后,服务器端解析这些状态,看看是否有相应事件的触发,当然,我们也可以通过后端代码访问这些数据,因为这些数据包含了该“控件”的所有信息,所以,有时会使我们对post和get方法在这里的作用有些迷茫,其实,这些数据都是通过post方法或者get方法实现传递的,至于服务器端是如何解析数据并执行的,我们现在不用管。
& & & &一个小测试,说明服务端控件传送state信息。
&form id="form1" runat="server" method="get"&
&asp:Button ID="Button1" runat="server" Text="测试" onclick="Button1_Click" /&
protected void Button1_Click(object sender, EventArgs e)
Response.Write("测试内容");
结果(方便大家看,这里用的为get方法)
& & & & 接着说我们ASP.net页面之间数据传输的问题,这里具体的代码就不写了,说一下思路。思路一:前台为主;思路二:后台为主。具体的东西大家可以看一下别人的东西吧!下面是我copy张世栋并简单做了一些修改的东西,大家可以看看
1. 使用QueryString变量
QueryString是一种非常简单的传值方式,他可以将传送的值显示在浏览器的地址栏中。但是对于传递数组或对象的话,就不能用这个方法了。
//ask.aspx的代码
protected void Button1_Click(object sender,EventArgs e)
//传递的参数包含在URL中,URL的长度有限制
Response.Redirect("answer.aspx?name=天天");
//answer.aspx中代码
protectedvoid Page_Load(object sender, EventArgs e)
Response.Write(Request.QueryString["name"]);
2. 使用Application 对象变量
Application对象的作用范围是整个全局,也就是说对所有用户都有效。其常用Lock和UnLock方法来对application对象进行锁定,防止多个用户同时对次此对象进行操作,造成数据混乱。
//ask.aspx的代码
private void Button1_Click(object sender, System.EventArgs e)
//类似与哈希表
Application["name"] = "天天";
//使用Server.Transfer跳转页面的时候浏览器显示的地址并没有改变
Server.Transfer("answer.aspx");
//answer.aspx中代码
private void Page_Load(object sender, EventArgs e)
Application.Lock();
Response.Write(Application["name"].ToString());
Application.UnLock();
3. 使用Session变量
其操作与Application类似,作用于用户个人,所以,过量的存储会导致服务器内存资源的耗尽。
//ask.aspx的代码
private void Button1_Click(object sender, System.EventArgs e)
Session["name"] = "天天";
Response.Redirect ("answer.aspx");
//answer.aspx中代码
private void Page_Load(object sender, EventArgs e)
Response.Write(Session["name"].ToString());
4. 使用Cookie对象变量
与Session一样,对每一个用户而言的,Cookie是存放在客户端的,而session是存放在服务器端的。而且Cookie的使用要配合ASP.NET内置对象Request来使用
//ask.aspx的代码
private void Button1_Click(object sender, System.EventArgs e)
HttpCookiecookieTest = new HttpCookie("name"); //创建cookie对象
cookieTest.Value ="天天";
//给cookie对象赋值
Response.AppendCookie(cookieTest);
//保存cookies对象(response.Cookie.Add(CookieName);)
erver.Transfer("answer.aspx");
//answer.aspx中代码
private void Page_Load(object sender, EventArgs e)
HttpCookie MyCookie= Request.Cookies["name"];//获取Cookie对象
String StrName =MyCookie.V
//获取其变量值
Response.Write(StrName);
5. 使用cache缓存的方式
缓存存在的时间不是太长所以需要慎重使用
//ask.aspx的代码
protected void Button1_Click(object sender,EventArgs e)
this.Cache.Insert("name", "天天");
Server.Transfer("answer.aspx");
//answer.aspx中代码
protectedvoid Page_Load(object sender, EventArgs e)
Response.Write(Cache["name"].ToString());
6. 使用Server.Transfer方法
这个才可以说是面象对象开发所使用的方法,其使用Server.Transfer方法把流程从当前页面引导到另一个页面中,新的页面使用前一个页面的应答流,所以这个方法是完全面象对象的,简洁有效。
//ask.aspx的代码
public string name
return "天天";
private void Button1_Click(object sender, System.EventArgs e)
Server.Transfer("answer.aspx");
//answer.aspx中C#代码
private void Page_Load(object sender, EventArgs e)
ask a = new ask();
string StrName
Response.Write(StrName);
& & & & 方法不仅仅只有上面那些,还有很多种,有兴趣的读者,可以继续做下去。
& & & &本篇博客主要写的内容为:静态HTML之间页面的转化;静态HTML之间数据的传递;ASP.net页面之间的转化;ASP.net页面之间数据的传递;静态HTML和ASP.net页面之间的交互。里面的有些内容可能不是做了为一个模块来讲,但是,可以从别的模块中得到,所以在上面的描述中就没有再重复的写了,另外,在静态HTML和ASP.net页面之间交互的解释非常的少,
TA的最新馆藏
喜欢该文的人也喜欢}

我要回帖

更多关于 前端后端是什么意思 的文章

更多推荐

版权声明:文章内容来源于网络,版权归原作者所有,如有侵权请点击这里与我们联系,我们将及时删除。

点击添加站长微信