array(2) { ["docs"]=> array(10) { [0]=> array(10) { ["id"]=> string(3) "428" ["text"]=> string(77) "Visual Studio 2017 单独启动MSDN帮助(Microsoft Help Viewer)的方法" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具,而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(8) "DonetRen" ["tagsname"]=> string(55) "Visual Studio 2017|MSDN帮助|C#程序|.NET|Help Viewer" ["tagsid"]=> string(23) "[401,402,403,"300",404]" ["catesname"]=> string(0) "" ["catesid"]=> string(2) "[]" ["createtime"]=> string(10) "1511400964" ["_id"]=> string(3) "428" } [1]=> array(10) { ["id"]=> string(3) "427" ["text"]=> string(42) "npm -v;报错 cannot find module "wrapp"" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具,而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(4) "zzty" ["tagsname"]=> string(50) "node.js|npm|cannot find module "wrapp“|node" ["tagsid"]=> string(19) "[398,"239",399,400]" ["catesname"]=> string(0) "" ["catesid"]=> string(2) "[]" ["createtime"]=> string(10) "1511400760" ["_id"]=> string(3) "427" } [2]=> array(10) { ["id"]=> string(3) "426" ["text"]=> string(54) "说说css中pt、px、em、rem都扮演了什么角色" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具,而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(12) "zhengqiaoyin" ["tagsname"]=> string(0) "" ["tagsid"]=> string(2) "[]" ["catesname"]=> string(0) "" ["catesid"]=> string(2) "[]" ["createtime"]=> string(10) "1511400640" ["_id"]=> string(3) "426" } [3]=> array(10) { ["id"]=> string(3) "425" ["text"]=> string(83) "深入学习JS执行--创建执行上下文(变量对象,作用域链,this)" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具,而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(7) "Ry-yuan" ["tagsname"]=> string(33) "Javascript|Javascript执行过程" ["tagsid"]=> string(13) "["169","191"]" ["catesname"]=> string(0) "" ["catesid"]=> string(2) "[]" ["createtime"]=> string(10) "1511399901" ["_id"]=> string(3) "425" } [4]=> array(10) { ["id"]=> string(3) "424" ["text"]=> string(30) "C# 排序技术研究与对比" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具,而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(9) "vveiliang" ["tagsname"]=> string(0) "" ["tagsid"]=> string(2) "[]" ["catesname"]=> string(8) ".Net Dev" ["catesid"]=> string(5) "[199]" ["createtime"]=> string(10) "1511399150" ["_id"]=> string(3) "424" } [5]=> array(10) { ["id"]=> string(3) "423" ["text"]=> string(72) "【算法】小白的算法笔记:快速排序算法的编码和优化" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具,而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(9) "penghuwan" ["tagsname"]=> string(6) "算法" ["tagsid"]=> string(7) "["344"]" ["catesname"]=> string(0) "" ["catesid"]=> string(2) "[]" ["createtime"]=> string(10) "1511398109" ["_id"]=> string(3) "423" } [6]=> array(10) { ["id"]=> string(3) "422" ["text"]=> string(64) "JavaScript数据可视化编程学习(二)Flotr2,雷达图" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具,而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(7) "chengxs" ["tagsname"]=> string(28) "数据可视化|前端学习" ["tagsid"]=> string(9) "[396,397]" ["catesname"]=> string(18) "前端基本知识" ["catesid"]=> string(5) "[198]" ["createtime"]=> string(10) "1511397800" ["_id"]=> string(3) "422" } [7]=> array(10) { ["id"]=> string(3) "421" ["text"]=> string(36) "C#表达式目录树(Expression)" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具,而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(4) "wwym" ["tagsname"]=> string(0) "" ["tagsid"]=> string(2) "[]" ["catesname"]=> string(4) ".NET" ["catesid"]=> string(7) "["119"]" ["createtime"]=> string(10) "1511397474" ["_id"]=> string(3) "421" } [8]=> array(10) { ["id"]=> string(3) "420" ["text"]=> string(47) "数据结构 队列_队列实例:事件处理" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具,而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(7) "idreamo" ["tagsname"]=> string(40) "C语言|数据结构|队列|事件处理" ["tagsid"]=> string(23) "["246","247","248",395]" ["catesname"]=> string(12) "数据结构" ["catesid"]=> string(7) "["133"]" ["createtime"]=> string(10) "1511397279" ["_id"]=> string(3) "420" } [9]=> array(10) { ["id"]=> string(3) "419" ["text"]=> string(47) "久等了,博客园官方Android客户端发布" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具,而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(3) "cmt" ["tagsname"]=> string(0) "" ["tagsid"]=> string(2) "[]" ["catesname"]=> string(0) "" ["catesid"]=> string(2) "[]" ["createtime"]=> string(10) "1511396549" ["_id"]=> string(3) "419" } } ["count"]=> int(200) } 222 js中“使用”el表达式 - 爱码网

在说相关内容前,一定要先熟悉jsp运行原理: 
http://blog.csdn.net/lmsnju/article/details/4813488 
http://hi.baidu.com/mingfang0219/blog/item/a13db6de9b36ee1e6327989f.html 
http://blog.sina.com.cn/s/blog_5ce1157b0100wjbv.html 

el表达式(运用el表达式直接获取值时,例如,${msg},不需要为msg提供set get方法;但是当获取对象的属性值时,例如,user.name,则必须为name属性提供set get方法)是jsp相关的概念,是在服务端执行的,服务端执行完成后再传给客户端浏览器,js是在客户端浏览器执行的,el在js前就已经被执行了。EL、JSTL以及其他各种标签是在服务端执行好后再通过网络传送给客户端,浏览器客户端收到后才会执行其中的js脚本。也就是说,el表达式生效的时候js代码还全都是文本,等js生效的时候早就没了el表达式了,你可以在浏览器中查看源代码,你就会发现el标签${}全没了,都转化为具体的值了。jsp和js不是一个平面上的东西,它们不可能在同一个时刻同时执行,它们没有任何交叉点。所以标题中“使用”两个字采用双引号,并不是js真正地使用el表达式,而是使用el表达式最终转化的值。 

类似的,对于js中“使用”java代码,与使用el表达式是一个道理:JSP是先进行编译把java代码都编译出来形成一张完整的页面再发到客户端,js只是在客户端执行,等到js执行的时候其实js已经看不到java代码了。 

如何在js代码(代码段或者js文件中的代码)中,获取el表达式的值或者java代码的值?可以通过下面的方式获取: 
jsp文件中的js获取jsp页面中el表达式的值:    var aaa = "${message}" 
jsp文件中的js获取jsp页面中java代码的变量值:var aaa = "<%=JAVA变量名 %>" 
所以,先在jsp文件中:定义js变量获取el表达式的值或者java代码的值: 

Jsp代码  js中“使用”el表达式
  1. <script type="text/javascript">  
  2.     var aaa = "${user.name}";                  //获取el表达式的值,此时aaa="jack"  
  3.     var nnn = "<%=Constants.getValue()%>";     //获取java代码的值,此时nnn="3"  
  4. </script>  

然后在其他js代码段中或者js文件中,就可以直接访问aaa跟nnn了。 

你可能已经注意到了:上面的el表达式跟java代码都加了引号,这样做,不管值是什么类型,都会转为字符串。如果el表达式跟java代码不加引号,会怎么样呢?看下面: 

Jsp代码  js中“使用”el表达式
  1. <script type="text/javascript">  
  2.     var aaa = ${user.name};              //在js执行的时候代码为var aaa = jack; 此时会把jack看做一个变量处理,如果此时碰巧js全局有jack变量,那就会把jack变量的值赋给aaa,否则报undefined错  
  3.     var nnn = <%=Constants.getValue()%>; //在js执行的时候代码为var nnn = 3;此时typeof(nnn)为number类型  
  4. </script>  

所以如果值是字符串类型的,最好加上引号;如果是数字类型的,可以加(会转为字符串),也可以不加(number类型)。参考:http://hi.baidu.com/sun321000s/blog/item/8551cc8eb6c3c18fa5c27255.html 

总结: 
在js文件中不能直接使用el表达式以及java代码(浏览器是识别不了jsp中el等标签的:返回给客户端的结果是JSP文件执行的结果,不包含任何JSP语法)。但是el表达式、java代码、js脚本、jstl标签等都可以在jsp文件中使用,所以要想在js代码中使用el表达式的值或者是java代码的值,可以通过jsp文件这样一个桥梁,达到目的! 

js写在jsp文件里,jsp能用的标签(el表达式、jstl标签、java代码等),js就能“用”;js单独写成一个文件,啥标签都不能“用”,都没效。不过一般不建议js使用乱七八糟的jsp标签。 

附: 
JSTL核心标签库的使用:http://www.cnblogs.com/lihuiyy/archive/2012/02/24/2366806.html 
EL表达式:http://www.cnblogs.com/Fskjb/archive/2009/07/05/1517192.html

相关文章: