`

JSP页面中如何引入js文件

 
阅读更多
1)引入的js文件出错,
检查方法:将Js的内容写在当前的页面的<script> </script>之间,看是否能够正常运行,如果不能,请核查代码
2) 如果引入的代码在当前页面中能够正常运行,但当引入时不能正常运行,则有两种可能
   A:引入Js的路径有问题
   B:引入的Js的编码格式与当前页面不匹配
3)引入Js的路径问题
   js的引入不外乎两种,相对路径与绝对路径
  test.js  与index.jsp 放在同一文件夹下,比如: web应用/manage/下面
  第一种情况 :
  一般在学习时, 一个tomcat上都跑多个工程, 用工程名来区分
因为我的的URL是 :http://localhost/工程名 /manage/index.jsp
多了一个工程名,所以要加 <%=request.getContextPath() %>
如下:
<script src="<%=request.getContextPath() %> /manage/test.js"></script>

  第二种情况:
  访问JSP文件时, 用相对路径引入JS,CSS文件是OK的
  真实项目中,  一个tomcat上要是也跑了多个工程, 并用IP来区分
  url 是这样的:  http://localhost/manage/index.jsp   注意这里,是直接访问JSP文件,不是    servlet,不是struts .
test2.js  与index.jsp 放在同一文件夹下,下面用相对路径来引入 JS文件 是OK 的:
<script src=test2.js></script>

第三种情况:一个通过Action跳转之后到达的Jsp页面需要引入一个Js文件:

  这种情况下,请使用绝对路径,
  在第二情况的基础上, 我们访问的是 servlet 或是struts的action  , 再转发到 index.jsp


url 是:  http://localhost/***.do或者  http://localhost/***.action 这里不是访问JSP文件了

因此路径应该这么写:
<script src="/manage/test.js"></script>
test2.js  前面一定要有/manage/
或者:<script src="http://127.0.0.1/工程名/manage/test.js"></script> 这种方法推荐

在引入js时,我们应该养成良好的习惯,请使用绝对路径,在开发时,能够大大的提高自己的开发效率。


4)引入js的编码问题;
  
   将两者的编码改为一致,一般我们可以修改JS文件编码使其与页面编码一致。
第二种方式是使用script标记的charset属性来显式指明所引入js文件的编码。如<script src="xx.js" charset="gbk"></script> 这样无论页面是什么编码,都可以正常的访问这个JS中的内容。
相比之下,第二种可能更方便一些,而且作为一种好的习惯,平时我们应该尽可能都写上charset属性。
分享到:
评论

相关推荐

    JSP加载JS文件不起作用的有效解决方法

    目录结构:jsp导入jquery文件,老是不起作用,原因在于: 代码如下: [removed][removed] 其不能访问/WEB-INF/目录下的文件,因此需要将加载的js文件其放倒webapp目录。 test.html: 代码如下: &lt;&#37;@ page ...

    jsp文件中引用外部.css或.js文件的路径问题.pdf

    在 jsp 文件中,我们可以使用相对于jsp 页面的相对路径来引用外部.css 或.js 文件。例如,在 test.jsp 文件中,我们可以使用以下代码来引用 styles 目录下的 main.css 文件和 scripts 目录下的 dtree.js 文件: ```...

    JSP页面显示PDF,根据PDF路径在JSP页面显示PDF

    首先,在页面中引入PDF.js的CSS和JavaScript文件,然后编写JavaScript代码来加载PDF: ```html &lt;script src="https://mozilla.github.io/pdf.js/build/pdf.js"&gt; ;"&gt; PDFJS.getDocument('...

    Jsp结合ElementUI要用的js和css

    对于Vue.js v2.6.11,你需要在JSP文件中引入以下代码: ```html &lt;script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"&gt; ``` 或者,如果你已经将vue.js文件下载到本地,你可以直接引用本地路径:...

    JSP标签,采用web.xml引入标签库描述文件

    本文将深入探讨JSP标签,特别是自定义标签,并解释如何通过`web.xml`配置文件来引入标签库描述文件,以便在JSP页面中使用这些标签。 首先,JSP标准标签库(JSTL)是一套预定义的标签,用于处理常见的任务,如迭代、...

    jsp页面调用js,弹出信息乱码

    当JSP页面、JavaScript文件、服务器端以及客户端浏览器之间的编码设置不一致时,就会出现乱码现象。例如,如果JSP页面使用的是UTF-8编码,而JavaScript文件使用的是GBK编码,那么在读取和渲染过程中就可能发生乱码。...

    jsp中使用vuejs+element-ui+vuejs第三方组件

    1. **引入Vue.js**: 在JSP页面中,我们可以通过 `&lt;script&gt;` 标签引入Vue.js的CDN链接或者本地文件。例如: ```html &lt;script src="https://cdn.jsdelivr.net/npm/vue@2"&gt;&lt;/script&gt; ``` 2. **创建Vue实例**: 在JSP的...

    jsp页面表格排序 js文件

    在这个场景下,我们关注的是`jsp页面表格排序 js文件`,这通常涉及到前端JavaScript技术,用于实现表格数据的客户端排序,而无需每次用户点击列头时都向服务器发送请求。 `jsp页面表格排序 js文件`的核心在于...

    jsp页面下载文件

    2. **JSP页面设计**:在JSP页面中,可以使用HTML的`&lt;a&gt;`标签创建一个链接,链接的目标是一个Servlet或者另一个JSP页面,该页面负责处理文件下载逻辑。例如: ```html &lt;a href="downloadFile.jsp?fileName=example....

    JAVA JS文件中引用JS文件,引入GOOG MAP

    在JavaScript(JS)环境中,我们经常需要在一个文件中引用另一个文件来实现代码的模块化和重用。在本例中,我们将讨论如何在JAVA(JavaServer Pages)环境中使用JS文件,并特别关注如何引入Google Maps API。这篇...

    jsp中好用的js日历文件(源码)

    在这个名为“jsp中好用的js日历文件(源码)”的资源中,我们主要探讨的是如何利用JavaScript实现一个日历控件,并将其嵌入到JSP页面中,以提供日期选择功能。 日历控件是Web应用中常见的一种交互元素,通常用于用户...

    jsp+js+oracle 实现文件上传数据库,下载到本地

    当用户请求下载文件时,JSP页面会根据数据库中的文件ID查询对应的BLOB数据,然后通过HTTP响应将文件内容返回给客户端。这里需要注意设置正确的HTTP响应头,如`Content-Type`表示文件类型,`Content-Disposition`指定...

    一个jsp文件模拟xml文件,通过js调用解析后,在新的jsp页面上显示省市二级联动。

    本示例中提到的“一个jsp文件模拟xml文件,通过js调用解析后,在新的jsp页面上显示省市二级联动”是一个典型的前端与后端交互的场景,涉及到的技术点主要包括JSP、XML和JavaScript,以及前端的动态数据处理和页面...

    jsp简单语法,servlet,JSP概述,JSP页面构成,注释,指令,脚本元素,动作元素,错误处理

    在JSP中,每个JSP页面在运行时都会被转换为一个Servlet类。JSP的执行流程是先编译为Servlet,然后通过Servlet处理请求并生成响应。 **8. 错误处理** JSP可以通过`&lt;error-page&gt;`标签在web.xml中配置错误处理,当特定...

    JSP同时选择多文件上传MultifileUploadDemo

    3. JSP页面或者Servlet捕获这个请求,解析请求体中的文件数据。 4. 文件数据被保存到服务器的临时目录或指定的存储路径。 5. 服务器返回一个确认消息,告知客户端文件上传成功。 在实现过程中,我们需要注意以下几...

    jsp在线浏览pdf文件的jar包和插件

    1. 引入PDF.js库:在你的JSP页面头部,使用`&lt;script&gt;`标签引入PDF.js的主文件,例如`&lt;script src="/js/pdfjs/pdf.js"&gt;&lt;/script&gt;`。 2. 加载PDF文档:创建一个JavaScript函数来加载PDF文件。使用`PDFJS.getDocument...

    js代码高亮显示 JavaScript代码高亮 jsp

    1. 引入库:在JSP页面的`&lt;head&gt;`部分引入代码高亮库的CSS和JS文件,例如: ```jsp &lt;link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.5.0/styles/default.min.css"&gt; ...

    jsp中调用js中的一个函数,函数传参的问题

    - 为了提高可读性和可维护性,推荐将复杂的JavaScript逻辑放在独立的.js文件中,然后通过`&lt;script src="..."&gt;`引用。 - 传递敏感数据时要格外小心,可能需要加密或使用安全的传输层协议(如HTTPS)。 5. **示例**...

    基于jsp的文件上传下载

    在Java Web开发中,JSP(JavaServer Pages)是一种用于创建动态网页的技术。"基于jsp的文件上传下载"是Web应用程序中的常见需求,涉及到客户端与服务器之间的数据交互。本项目详细阐述了如何利用JSP实现文件的上传和...

    jsp引入css及js的统一书写规范,走的是servlet入口

    一开始想法是为了统一管理css\js,写在jsp页面上,但加载时一股脑全加载进来,后来改写成用关键字来引入对应的样式及脚本,但又后来觉得可能引入的便签上有特殊属性,再次扩展,最终演变成这样的书写格式,这样统一...

Global site tag (gtag.js) - Google Analytics