你的位置:首页 > Java教程

[Java教程]Web开发中前台与后台技术小结

  在我们日常Web开发中,常常用到EL表达式,JSTL标签,还有可能用到JavaScript中的eval()。下面就这样技术和函数小小说明一下。

  EL(Expression Language),全称表达式语言,既然是开发语言,那么就像Java等语言一样是用来写语句的,通常是用在JSP页面中,我们为了获取JSP提供的内置对象的属性值,

我们通常会使用到EL表达式,比如开发中常见的一个需求就是获取项目的根目录,如果项目的名值变化了,我们在指定路径时,如果把项目的根目录用一个变量来表示的话,那么就不

需要修改我们代码,所以此时我们通常会使用到一个常见的表达式${pageContext.request.contextPath},这个表达式的基本解释就是获取JSP的内置对象pageContext的request

对象的属性contextPath的值。到此我们可以举一个小例子来看看${pageContext.request.contextPath}的使用:

比如我们的项目结构是下面:

  --demo

    --src

    --WebRoot

      --WEB-INF

      --css

      --js

      --img

      --font

      --page

  如果我们的jsp文件全部放在page目录下面,其中有一个文件demo.jsp引用了img文件夹下的一张图片nav.jpg,核心代码如下:

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>

<!DOCTYPE html>
<html>
  <head>

    <title>demo演示页面</title>

  </head>

  <body>

    <img alt="nav" src="${pageContext.request.contextPath}/img/nav.jpg">

  </body>

</html>

 

如果这个项目发布到服务器中去了,以后有需求,说项目名得修改为demonstration,如果我们上面的代码中不使用EL表达式来获取项目名的话,上面的代码可能就是下面的样子

<img alt="nav" src="http://www.cnblogs.com//demo/img/nav.jpg">,这时如果修改了项目名demo为demonstration,我们demo.jsp代码就得跟着修改为下面的样子

<img alt="nav" src="http://www.cnblogs.com//demonstration/img/nav.jpg">。

  所以我们使用EL表达式语言的第一个直观的好处就是从页面中抽取可能变化的部分,将其封装为一个变量,这样就方便了代码的维护。当然除了这一点外,我们在开发中还是会

大量使用到EL表达式的,比如获取page域、request域、session域或者application域中的参数和变量,我们经常在页面中写上这样的EL表单式:

<input id="" name="username" type="text" value="${username}" > 这样的input输入框通常出现在表单中,那么后面的value="${username}是什么含义

呢? 因为表单一般是用来封装用户提交的数据,那么如果用户输入有误,表单提交给后台程序处理,后台程序提示报错不能正常按照业务逻辑走下去,比如用户登陆表单中有上面的

<input>输入框,用户输错了用户名,那么就不能正常登陆,页面应该跳转到登陆页面,提示相应的错误,那么如果用户名很长,输入不是很方便的话,我们希望将用户输入的用户

名回显的话,那么${username},就是完成这一功能的。它会从上面讲到的page域开始查找是否有一个变量username,并通过${}来把变量的值获取到,如果没有再从request

域中查找...如果还没有就从session域中查找,如果还没有找到的话,最后会从application域查找,如果有就输出其值,如果还没有找到,就返回''(或者null).所以页面中<input>

第一次是没有值的,如果用户输入了错误的值,页面跳转回来的时候会把用户输入的错误的值回显出来。

  所以EL表达式的第二个用处就是常用来做数据的回显。讲到此处,顺便说下,EL用来做页面数据回显的好处,因为EL底层也是使用Java语言写的,所以使用EL可以轻松获取

Java类型的数据,然而jsp页面最终通过服务器"翻译"成html的时候,只认识string类型的数据,这时使用EL它会自动完成基本数据类型的转换,比如int类型数据,Date类型的数

据。这一点是JavaScript无法比拟的,因为JavaScript是无法直接解析后台传过来的Java类型数据。

  那么开发中常常使用EL的地方还有吗?很显然还是有的,但是它喜欢带上它的朋友JSTL一起。他们通常会一起合作来完成一些工作。比如我们有一个需求就是判断用户是否登

陆,如果登陆则显示相应的操作菜单,我们通常这么使用:

<c:if test="${user != null}">

  <ul >

    <li><a href="#">个人主页</a></li>

    <li><a href="#">注销</a></li>

  </ul>

</c:if>

所以可以看出来JSTL有点像标签,没错JSTL就是 JSP标准标签库,标签的底层实际上也是使用Java编写的,它通常和逻辑判断有关联,同时呢,它的判断条件很多时候又依赖EL来

获取,所以说JSTL和EL是一对好朋友,互相帮助,彼此协作。JSTL还是有很多的功能的,限于时间和篇幅,我就把开发中常见的JSTL标签的使用场景列举一下:

(1)使用JSTL标签的core标签,常常使用别名c,比如<c:set>设置值,用来来时存储一个值,一般是是供function标签使用的、<c:out>输出值,可以实现自动转义,防止脚本攻

击,<c:url>可以拼接url路径并带上参数,这样也可以防止提交参数乱码;

(2)还有刚才说到function标签,我们可以截取内容显示,fn:substring();

(3)除此之外我们还常常用到数据的格式化显示别名fmt的标签,实现格式化显示日期,数据,货币。

 

  最后说明一下,JavaScript中的eval(),首先它是一个函数,它的功能是:可计算某个字符串,并执行其中的的 JavaScript 代码,但是我们很少直接使用,我们使用它的情况是

使用eval()来将json格式的数据的字符串解析成一个对象,比如下面的例子:

var data = '{"return_code":0,"return_message":"success","data":{"data":[{"id":"1","question":"公主令牌在哪交?"},{"id":"2","question":"公主护使有什么用?"},{"id":"3","question":"角斗场在哪?"},{"id":"4","question":"北部断层在哪?"},{"id":"5","question":"欢乐令有什么用?"},{"id":"6","question":"令牌积分有什么用?"},{"id":"7","question":"南部断层在哪?"},{"id":"8","question":"大妖魔令牌交给谁?"},{"id":"9","question":"神工坊在哪?"},{"id":"10","question":"警戒妖珠有什么用?"}]}}'; 

 

我们可以通过下面的代码获取上面类Map对象数据:

var obj = eval("("+data+")");         

alert("return_code:"+obj["return_code"]);  

alert("第一个问题id:" + obj["data"]["data"][0]["id"]);

 

  好了,时间不早了,祝自己做一个拯救世界的好梦!世界不早了,Good Night ,World !