`
webdev2014
  • 浏览: 682955 次
文章分类
社区版块
存档分类
最新评论

解析客户端脚本、服务器端脚本

 
阅读更多

  做b/s的东西,感觉首先要弄懂客户端与服务器端的交互原理(参考之前文章:http://blog.csdn.net/wang379275614/article/details/9771659),前台与后台的概念,前台、后台代码是如何被编译或解释的一个过程,不能云里雾里。

  现在做网站必然离不开脚本,如果只懂得写codebehide里的东西是远远不够的,这里主要介绍asp.net中脚本(js为例)的分类及解释过程。

两种脚本概念

  在写js代码时,首先要知道,脚本分客户端脚本和服务器端脚本,它们二者有很大的区别,解释机理是不同的。顾名思义,一个运行在客户端,一个运行在服务器端。(一般都写在前台的.aspx文件中)

客户端

客户端脚本完全在客户浏览器中解释执行,主要是控制用户与浏览器的交互,它在服务器端不做任何处理,包括

  Ø <script>标记对中的代码;

  Ø 写在一个单独js文件中(例如<script id="s" src="test.js"></script>中的test.js)中的代码。

服务器端

主要用于生成网页代码,感觉asp.net中服务器端脚本与后台.cs文件中得代码地位是相同的,就是将后台代码以服务器端脚本的形式转移到了前台。包括

  Ø <scriptrunat="server">标记对中的代码(只能放置方法和属性等,而不能直接添加语句和表达式);

  Ø <%%>中的代码。

  在处理页面时web服务器会检测出页面中的服务器端内容,包括后台代码和前台代码中得服务器端脚本,并进行编译,生成一种汇编语言,并保存在程序集中(备后续使用,一次编译即可)。(asp中的服务器端脚本每次都由服务器端脚本引擎解释执行,与asp.net机制不同)


对比


  Ø 客户端脚本主要用于控制用户与浏览器的交互;而服务器端脚本与code-behind代码相似,主要用于生成网页代码。

  Ø 注意两种脚本定义方法的方式,客户端脚本定义一个方法用functionfunName(){};客户端脚本其实就是后台代码,所以与传统的后台编程语言定义方法的方式一致,例如,public string funName(){};

  Ø 客户端脚本对最终浏览用户相对是公开的;服务器端脚本是不对外开放的,要经过web服务器处理。即通过客户端浏览器请求到页面后,右击页面,查看源文件中的代码,有完整的客户端脚本,而肯定没有服务器端脚本。例如:


  


  Ø 客户端(html)控件可以随意访问客户端或服务器端脚本定义的方法,因为此时页面上所有的东西都已发送到客户端;服务器端控件,只能调用服务器端脚本或.cs中定义的方法,若调用客户端脚本定义的方法,必然编译时因找不到方法而发生编译错误。

测试1:客户端控件调用服务器端脚本定义的方法,没错误

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    定义服务器端脚本
    <script type="text/javascript" runat="server">
         public string testServer(){     
            return "这是服务器端脚本";
         } 
    </script>

</head>
<body>
    <form id="form1" runat="server">
    <div>
        <%--服务器端控件调用服务器端脚本定义的方法testServer,没问题--%>
        <asp:TextBox ID="TextBox1" runat="server" Text="<%#testServer()%>"></asp:TextBox>

        <%--客户端控件调用服务器端脚本定义的方法testServer,没问题--%>
        <input id="Text1" type="text" value="<%#testServer()%>" />
    </div>
    </form>
</body>
</html>

测试2:服务器端控件调用客户端脚本定义的方法

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>

    <%--定义客户端脚本,如下:--%>
    <script type="text/javascript">
        function testBrowser() {
            alert("这是客户端脚本");
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <%--客户端控件调用客户端脚本定义的testBrowser函数没有问题,如下语句:--%>
        <%--<%--<input id="Button2" type="button" value="button" onclick="testBrowser()" />--%>

        <%--服务器端控件调用客户端脚本的testBrowser方法会发生编译错误,如下:--%>
        <asp:Button ID="Button1" runat="server" Text="Button" OnClick="testBrowser()" />
    </div>
    </form>
</body>
</html>

会发生如下错误:

总结

  aspx、aspx.cs文件运行时的处理过程:服务器先将页面中没服务器标识(例如runat="server")的部分取出,编译其它部分(包括服务器端脚本),然后发送处理过后的文件至客户端,由客户端的脚本引擎解释客户端脚本。

  这是目前自己的理解,可能有不当的地方,请参考。

分享到:
评论

相关推荐

    服务器端JavaScript——NodeJS

    NULL 博文链接:https://williamwhj.iteye.com/blog/2032655

    服务器端返回json数据

    服务器返回json数据到客户端,android端可以解析

    PHP生成静态页面详解

    PHP脚本是一种服务器端脚本程序,可通过嵌入等方法与HTML文件混合,也可以类,函数封装等形式,以模板的方式对用户请求进行处理。无论以何种方式,它的基本原理是这样的。由客户端提出请求,请求某一页面 -----&gt; ...

    SU20增强脚本

    词汇:Web浏览器,Web服务器,URL,解析,协议,服务器,客户端,路径,Internet服务提供商(ISP),DNS服务器,IP地址,http请求,http响应,客户端编程,服务器端编程 客户端编程回顾 JavaScript简介 Node.js和...

    php 生成静态方法

     PHP脚本是一种服务器端脚本程序,可通过嵌入等方法与HTML文件混合,也可以类,函数封装等形式,以模板的方式对用户请求进行处理。无论以何种方式,它的基本原理是这样的。由客户端提出请求,请求某一页面 -----&gt;...

    JSP期末复习资料详细解析

    2.Web是与平台无关、分布式的、图形化的和易于导航的,定义了客户端和服务器端如何通信。 3.HTTP(超文本传输协议)是一种Internet上常见的协议,用于传输超文本标记语言(HTML)编写的文件,也就是通常所说的网页。...

    好好了解一下Cookie(强烈推荐)

    Cookie的诞生 由于HTTP协议是无状态的,而服务器端的业务必须是要有...服务器端的发送与解析 发送cookie 服务器端像客户端发送Cookie是通过HTTP响应报文实现的,在Set-Cookie中设置需要像客户端发送的cookie,cookie格

    PHP论文格式化系统-前台的设计与实现(源代码+论文)

    在接收到送服务器端发送来的xml之后,系统用javascript脚本解析xml然后填写到表单中去。他们可以按时的发表自己的论文。系统也提供学生和导师的论文交互平台,论文交互平台采用了php脚本编写了数据库操作类和常用...

    仿服务器端脚本方式的JS模板实现方法

    head&gt; &lt;... charset=gb2312″ /&gt; &lt;... [removed] /** * @description: * 使用javascript模仿JSP的页面解析和运行,运行于客户端 * 允许应用人员象开发JSP页面一样使用&lt;&#37;..%&gt; *

    Python概述(1).pdf

    从发给服务器端 的 CGI 脚本的表单中解析信息; 通过 URL 获取网页; 从获取的网页中解析 HTML 和 XML 文件;通过 XML-RPC 、SOAP 和 Telnet 通信等。Python 的库使这一切变得相当简单。 Python 可以通过 C/C++ ...

    北京中科信软AJAX培训

    客户端脚本与服务器端对象的交互 服务器端Ajax框架 DWR(Direct Web Remoting)简介 配置DWR运行环境 使用DWR直接访问Java业务逻辑 利用DWR实现常见的Ajax功能 DWR异常处理 DWR开发常见问题解决 和现有Web框架Struts...

    CCNA教材实验教材

    3 服务器端为新登陆用户分配一空闲ID,并将新用户信息添加至Xml用户列表中,最后向客户端返回其用户ID、用户列表和最近若干条聊天信息 4 客户端解析接收到的服务器返回信息,初始化用户名称及ID,加载用户列表和聊天...

    ASP.NET Web Page应用深入探讨第1/2页

    首先,我们先复习一下Web服务器页面的基本执行方式: 1、客户端通过在浏览器的地址栏敲入地址来发送请求到服务器端 2、服务器接收到请求之后,发给相应的服务器端页面(也就是脚本)来执行,脚本产生客户端的响应,...

    SQLServer中巧用脚本避免硬SQL

    如何才能让客户端仍然通过统一的方式传递参数,而服务器端又能以统一的方式执行预编译SQL呢?

    asp在线考试系统的设计与实现

    因为所有的程序都将在服务器端执行,包括所有嵌在普通 HTML中的脚本程序。当程序执行完毕后,服务器仅将执行的结果返回给客户浏览器,这样也就减轻了客户端浏览器的负担,大大提高了交互的速度。但是这样也导致一个...

    PHP论文格式化系统-前台的设计与实现(源代码+毕设文档).zip

    在接收到送服务器端发送来的xml之后,系统用javascript脚本解析xml然后填写到表单中去。他们可以按时的发表自己的论文。系统也提供学生和导师的论文交互平台,论文交互平台采用了php脚本编写了数据库操作类和常用...

    PHP论文格式化系统-前台的设计与实现(源代码+论文).zip

    在接收到送服务器端发送来的xml之后,系统用javascript脚本解析xml然后填写到表单中去。他们可以按时的发表自己的论文。系统也提供学生和导师的论文交互平台,论文交互平台采用了php脚本编写了数据库操作类和常用...

    PHP论文格式化系统——前台的设计与实现毕业设计毕业论文

    在接收到送服务器端发送来的xml之后,系统用javascript脚本解析xml然后填写到表单中去。他们可以按时的发表自己的论文。系统也提供学生和导师的论文交互平台,论文交互平台采用了php脚本编写了数据库操作类和常用...

Global site tag (gtag.js) - Google Analytics