WEB-INF下的HTML文件引用WEB-INF外的JS文件时的src路径问题

问题描述

这是一个跟着慕课视频做项目时遇到的问题:
视频中老师在shopoperation.html中导入js文件时是这样用的:

<script type='text/javascript' 
src='../resources/js/shop/shopoperation.js' charset='utf-8'></script>

然后项目结构图是这样的:
在这里插入图片描述
shopoperation.html所在的路径是’src/main/resources/webapp/WEB-INF/html/shop‘,如果用’…/'来表示返回上一级目录应该返回到’src/main/resources/webapp/WEB-INF/html’下,但是

<script type='text/javascript'
		src='../resources/js/shop/shopoperation.js' charset='utf-8'></script>

给人的感觉使用’…/'后直接返回到了webapp下?这和我的认知产生了矛盾。

问题解决

在慕课课程的回答里找答案:
路径以Tomcat实际发布的路径为准,不是以在eclipse上看到的项目路径为准。
启动Tomcat后在页面上点击F12查看项目结构:
在这里插入图片描述
如果以在tomcat上发布的项目为准,’…/‘后退到的路径是o2o(就是我做的这个项目的名称),那src=’…/resources/js/shop/shopoperation.js’ 自然可以找到shopoperation.js文件。
访问本页面的URL是http://localhost:8080/o2o/shopadmin/shopoperation。也许Tomcat发布项目的路径就是URL中的路径?

验证

对上一部分做了进一步的验证:

<script type='text/javascript' 
src='../resources/js/shop/shopoperation.js' charset='utf-8'></script>

中的路径改成了

<script type='text/javascript'
src='/o2o/resources/js/shop/shopoperation.js' charset='utf-8'></script>

JS文件依然被正确地找到了。
在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/weixin_38404857/article/details/109961129