在页面中引入javascript文件的方式是多种多样的,本文介绍两种。

  1. 通过<script>标签插入js文件

通过这种方式引入的js,写对js文件和jsp文件的路径很重要。下面给出一个项目的路径结构,由此说明我是怎么在项目的jsp页面中引入js的。

在eclipse中新建一个web项目,目录结构如下:

可以看到,jsp页面和欲引入的js在不同的目录下。

以下是jsp页面关于引入js的代码。

一、在页面的最开始,获取项目的根路径。

    <%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>

举例来说,

path可能如下:myProject

basePath可能如下:http://localhost:8080/myProject/

二、在<head></head>中,插入下述代码:

base href="<%=basePath%>">

这句代码的作用是将整个页面的根路径设置为项目路径。

三、<script>的设置为:

<script type="text/javascript" src="plugins/audio/howler.js"></script>
<script type="text/javascript" src="plugins/jquery/jquery.js"></script>

2.直接在<script type="text/javascript"></script>标签对中写入js代码

示例如下:

<script type="text/javascript">
$(document).ready(function() {
alert("ok");
});
</script>

jsp文件引入js文件的方式(项目部署于web容器中)的更多相关文章

  1. Vue文件 引入.js文件 的组件

    Vue.component('remote-script', { render: function (createElement) { var self = this; return createEl ...

  2. 将spring boot项目部署到tomcat容器中

    一. 我这里用的环境 tomcat: tomcat 8 jdk: jdk 7 spring boot 版本: 1.5 二. 将创建好的spring boot项目做如下修改 2.1. 修改打包形式 在p ...

  3. 把spring-boot项目部署到tomcat容器中

    http://blog.csdn.net/javahighness/article/details/52515226

  4. jsp引入js文件

    转自:http://blog.csdn.net/ppzhangj/article/details/7859628 1)引入的js文件出错, 检查方法:将Js的内容写在当前的页面的<script& ...

  5. 用maven创建项目引入js文件位置

    用maven创建项目引入js文件位置 截图如下:

  6. vue脚手架使用swiper /引入js文件/引入css文件

    1.安装vue-cli 参考地址:https://github.com/vuejs/vue-cli 如果不使用严格语法需要在后三项打no:(加了挺头疼的,老是报错,但是对自己的代码规范性也是有很大的帮 ...

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

    JSP加载JS文件不起作用的有效解决方法 作者: 字体:[增加 减小] 类型:转载 时间:2014-04-08 jsp导入jquery文件,老是不起作用,原因在于其不能访问/WEB-INF/目录下的文 ...

  8. 1.在html中引入js文件和Jquery框架

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. Vue在单独引入js文件中使用ElementUI的组件

    Vue在单独引入js文件中使用ElementUI的组件 问题场景: 我想在vue中的js文件中使用elementUI中的组件,因为我在main.js中引入了element包和它的css,并挂载到了全局 ...

随机推荐

  1. js的数据类型

    关于js中的几大数据类型,估计大家都很熟悉:String.Number.Array.Bollean.Null.Undifine.Object: 从这其中,可以延伸出一个感念:基本数据类型和引用类型: ...

  2. 比较常用的几个maven第三方镜像

    OSC的:<mirror>    <id>CN</id>    <name>OSChina Central</name>           ...

  3. 在linux下写一只优雅的爬虫---优雅的获取沈航所有学生的个人信息

    一:ubuntu下安装python集成环境pycharm以及免费激活 安装 首先去下载最新的pycharm 2016.2.3,进行安装.可以直接在官网下载.选择自己所对应的版本 PyCharm 的激活 ...

  4. Python-lambda函数,map函数,filter函数

    lambda函数主要理解: lambda 参数:操作(参数). lambda语句中,冒号前是参数,可以有多个,用逗号隔开,冒号右边的返回值.lambda语句构建的其实是一个函数对象 map函数: ma ...

  5. 柯朗数(Courant number)研究

    在数值计算过程中,对于计算结果的准确性和效率有很高的要求,但是这两者之间往往互相矛盾:而使用柯朗数可用于平衡两者. 1.柯朗数的定义: C = sqrt(gh)*t/s 其中,t是时间步长,s是网格在 ...

  6. SQL Server 索引(index) 和 视图(view) 的简单介绍和操作

    --索引(index)和视图(view)-- --索引(index)----概述: 数据库中的索引类似于书籍的目录,他以指针形式包含了表中一列或几列组合的新顺序,实现表中数据库的逻辑排序.索引创建在数 ...

  7. 虚拟机配置光盘为yum源

    很多时候, 我们装系统用的光盘就足够充当我们的软件源了. 但是, 怎么才能配置好让光盘成为yum的软件源, 让yum命令找到这个地方, 从而进行软件的安装. 1. 在虚拟机中把光盘挂载上 挂载上之后, ...

  8. Oracle数据库根据时间查询

    ' and trans_dt between to_date('2010-12-01 00:00:00','YYYY-MM-DD HH24:MI:SS') and to_date('2011-12-3 ...

  9. ajax data传值

    如果要我们要把整个form1表单中的输入框都传过去可以用data:$("#form1").serialize(), 但是我们如果还要传一个不在form中的值呢? 可以使用下面这种方 ...

  10. vim 大全用法

    vim中常用设置和操作: 在Linux系统下: 打开vi 文件: 0 数字0,跳转至行首    ^ 跳转至行第一个非空字符    $ 跳转至行尾 vim 括号匹配跳转操作: ctrl+] 跳转至函数或 ...