jsp文件引入js文件的方式(项目部署于web容器中)
在页面中引入javascript文件的方式是多种多样的,本文介绍两种。
- 通过<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容器中)的更多相关文章
- Vue文件 引入.js文件 的组件
Vue.component('remote-script', { render: function (createElement) { var self = this; return createEl ...
- 将spring boot项目部署到tomcat容器中
一. 我这里用的环境 tomcat: tomcat 8 jdk: jdk 7 spring boot 版本: 1.5 二. 将创建好的spring boot项目做如下修改 2.1. 修改打包形式 在p ...
- 把spring-boot项目部署到tomcat容器中
http://blog.csdn.net/javahighness/article/details/52515226
- jsp引入js文件
转自:http://blog.csdn.net/ppzhangj/article/details/7859628 1)引入的js文件出错, 检查方法:将Js的内容写在当前的页面的<script& ...
- 用maven创建项目引入js文件位置
用maven创建项目引入js文件位置 截图如下:
- vue脚手架使用swiper /引入js文件/引入css文件
1.安装vue-cli 参考地址:https://github.com/vuejs/vue-cli 如果不使用严格语法需要在后三项打no:(加了挺头疼的,老是报错,但是对自己的代码规范性也是有很大的帮 ...
- jQuery之JSP加载JS文件不起作用的有效解决方法
JSP加载JS文件不起作用的有效解决方法 作者: 字体:[增加 减小] 类型:转载 时间:2014-04-08 jsp导入jquery文件,老是不起作用,原因在于其不能访问/WEB-INF/目录下的文 ...
- 1.在html中引入js文件和Jquery框架
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Vue在单独引入js文件中使用ElementUI的组件
Vue在单独引入js文件中使用ElementUI的组件 问题场景: 我想在vue中的js文件中使用elementUI中的组件,因为我在main.js中引入了element包和它的css,并挂载到了全局 ...
随机推荐
- IE8下服务端获取客户端文件的路径为C:/fakePath问题的解决方案
上一篇文章上提到,IE8下服务端获取客户端文件的路径时,会变成C:/fakePath问题,于是乎通过文件路径去获得文件大小就失败了. 上网搜了一下,主要原因是IE8因为安全考虑,在上传文件时屏蔽了真实 ...
- AngularJS 2 Typescript 相关
1. Angular 2 In 60 Minutes (2016年11月23日) https://www.youtube.com/watch?v=-zW1zHqsdyc 2. AngularJS Cl ...
- Hello mybatis
idea玩mybatis,终于搞出个hello mybatis.记录下过程,备忘. 1.person表 CREATE TABLE `person` ( `id` ) NOT NULL AUTO_INC ...
- python---进程、线程
一.进程 二.线程 1,使用Thread类创建线程 #!/usr/bin/env python # -*- coding:utf-8 -*- __author__ = 'zhoufeng' impor ...
- ---Linux 10 年的硕果累累啊!
http://mt.sohu.com/20160128/n436204298.shtml
- ActiveMQ学习笔记(5)——使用Spring JMS收发消息
摘要 ActiveMQ学习笔记(四)http://my.oschina.net/xiaoxishan/blog/380446 中记录了如何使用原生的方式从ActiveMQ中收发消息.可以看出,每次 ...
- Python全栈开发day8
一.python生成/迭代器 yiled生成数据 python迭代器, 访问数据(通过next一次一次去取) 二.反射 通过字符串的形式,导入模块 通过字符串的形式,到模块中,寻找指定的函数,并执行 ...
- 犀利点评:csdn某文<第一次创业还是失败了---分享失败的经验>
今天上午在csdn看了一篇创业文,突然想无节操的做一下点评. 原文详细地址如下:http://blog.csdn.net/android_tutor/article/details/9815801 以 ...
- 我的第一个web应用开发搭建-环境配置
MyEclipse 2014 破解图文详细教程 MyEclipse作为Java EE最受欢迎的IDE,最新版本为2014版,MyEclipse 2014破解的方法. 一.安装完成MyEclipse20 ...
- php返回数据库查询时出现Resource id #2
1.使用php调用MySQL数据库的过程是不是先用mysql_query(SELECT*...)或mysql_list_dbs()等查询函数返回结果指针(mysql查询函数中还有没有这样的返回指针函数 ...