把需要引入的CSS和JS所有外部文件合并为两个文件，方便调用怎么做？

最新推荐文章于 2023-06-20 00:16:54 发布
最新推荐文章于 2023-06-20 00:16:54 发布
阅读量397 收藏 1
点赞数
分类专栏： jsp 文章标签： jsp
版权声明：本文为博主原创文章，遵循 CC 4.0 BY 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/aaxzsuj/article/details/109205057
版权

把需要引入的CSS和JS所有外部文件合并为两个文件，方便调用怎么做？

1.问题原因

项目开发几乎每个JSP都会引用JS和CSS，那么就会有一些常用JS或者CSS，我们不希望每个JSP文件都引用一堆文件，而是只引用公用的JS和CSS就可以了；

2.解决办法

创建commonsCss.js文件----存放  css文件路径

document.write('需要的css路径')
//文件只是学习，不做其他用途
//全局css
document.write(' <link href="static/Hplus/css/bootstrap.min.css" rel="stylesheet">')
document.write('<link href="static/Hplus/css/bootstrap-table.min.css" rel="stylesheet">')
document.write(' <link href="static/Hplus/css/font-awesome.css">')
document.write('  <link href="static/Hplus/css/animate.css" rel="stylesheet">')
document.write('   <link href="static/Hplus/css/style.css" rel="stylesheet">')
//漂亮的弹窗口必须引入css
document.write('   <link href="static/Hplus/css/plugins/sweetalert/sweetalert.css" rel="stylesheet">')

创建commonsJs.js文件----存放  Js文件路径

//全局js
document.write('<script src="static/Hplus/js/jquery.min.js"></script>')
document.write('<script src="static/Hplus/js/bootstrap.min.js?"></script>')
document.write('<script src="static/Hplus/js/plugins/metisMenu/jquery.metisMenu.js"></script>')
document.write('<script src="static/Hplus/js/plugins/slimscroll/jquery.slimscroll.min.js"></script>')
document.write('<script src="static/Hplus/js/plugins/layer/layer.min.js"></script>')
document.write('<script src="static/Hplus/js/bootstrap-table.min.js"></script>')
document.write('<script src="static/Hplus/js/plugins/sweetalert/sweetalert.min.js"></script>')

JSP页面引用

<head>
    <title>宠物阁</title>
    <base href="<%=basePath%>">
    <%--全局css--%>
    <script src="static/commons/css/commonsCss.js"></script>
</head>
<body>
</body>
<%--全局js--%>
<script src="static/commons/js/commonsJs.js"></script>

-南帝-
关注
专栏目录
css和js优化,js css优化-- 合并和压缩
weixin_42502448的博客
08-03 727
在项目框架中，首先要引用很多css和js文件，80%的用户响应时间都是浪费在前端。而这些时间主要又是因为下载图片、样式表、JavaScript脚本、flash等文件造成的。减少这些资源文件的Request请求数将是提高网页显示效率的重点。这里好像有个矛盾，就是如果我减少了很多的图片，样式，脚本或者flash，那么网页岂不是光秃秃的，那多难看呢？其实这是一个误解。我们只是说尽量的减少，并没有说完全不...
多个html引入重复文件,用JS实现避免重复加载相同js文件
weixin_29343807的博客
06-17 2213
我们在日常开发过程中，可能有重复加载同一个资源例如:1.js,为了提高性能和用户体验这里我们用原生JS实现同一个资源只加载一次。下面是 common.js里的JS代码//使用沙箱模式防止污染外面的变量; (function () {//让外面可以只能访问到require变量window.require = require;//定义一个加载模块的方法function require(moduleNa...
Python3.x+QFileDialog 实现界面功能“选择文件夹”、“选择文件”、“选择多个文件”和“保存文件”
07-05
Python3.x+QFileDialog 实现界面功能“选择文件夹”、“选择文件”、“选择多个文件”和“保存文件”。
PathPicker
贾亮的专栏
08-05 599
PathPicker是个不错的东西，喜欢的话，可以看看这个连接。PathPicker的介绍
python-filedialog 文件/文件夹 选择器
zhangzx36的博客
08-25 4081
tkinter.filedialog python-filedialog 文件/文件夹 选择器
python读取文件选择器中的文件_Python库中的简单终端文件选择器
weixin_39993301的博客
12-18 358
我写了两个简单的命令行/终端Python程序来解析我们在心理学实验室中使用的实验运行软件的数据文件。这些程序将被那些通常精通计算机的人使用，但不一定能使用带有标志的unix风格的完整命令，所以我通常只是让程序问一些问题，比如“你想处理哪个文件？”然后让用户从列表中选择，如下所示：import textwrapimport osimport sysdef get_folder():""" Print...
python --windows打开文件选择器
weixin_44634704的博客
02-18 3688
安装 pip install pywin32 实例 import win32ui dlg = win32ui.CreateFileDialog(1) # 参数 1 表示打开文件对话框 dlg.SetOFNInitialDir('C://') # 设置打开文件对话框中的初始显示目录 dlg.DoModal() filename = dlg.GetPathName() print(filename) ...
HTML5和CSS3 WEB技术开发
张晨光老师的播客
01-02 6416
B站视频参考：https://www.bilibili.com/video/BV1H44y1k7ze/[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Uwbid43Z-1672665963237)(asseits/image-20210831212039584.png)]HTML:超文本标记语言(Hyper Text Markup Language)，标准通用标记语言下的一个应用。 HTML 不是一种编程语言（C、Java、python、R等），而是一种标记语言 (markup
CSS入门？一篇就够了！
xj-up的博客
03-20 9491
CSS初识 CSS(Cascading Style Sheets) 美化样式 CSS通常称为CSS样式表或层叠样式表（级联样式表），主要用于设置HTML页面中的文本内容（字体、大小、对齐方式等）、图片的外形（宽高、边框样式、边距等）以及版面的布局等外观显示样式。 CSS以HTML为基础，提供了丰富的功能，如字体、颜色、背景的控制及整体排版等，而且还可以针对不同的浏览器设置不同的样式。 引入C...
HTML5、CSS、JS基础
qq_49101841的博客
03-03 2255
学习笔记
PathPicker：PathPicker接受各种输入-git命令，grep结果，搜索的输出-几乎所有东西。 解析输入后，PathPicker为您提供一个不错的UI，以选择您感兴趣的文件。之后，您可以在自己喜欢的编辑器中打开它们或执行任意命令
02-14
路径选择器 Facebook PathPicker是一个简单的命令行工具，解决了从bash输出中选择文件的永久性问题。 PathPicker将： 解析所有输入行以查找类似于文件的条目 在方便的选择器UI中显示管道输入 允许您： 编辑您喜欢的$EDITOR的选定文件 与他们执行任意命令 通过观看一个简单的演示，最容易理解： 例子 安装PathPicker之后，使用它就像将管道插入fpp一样容易。 它需要各种各样的输入-请尝试以下所有选项： git status | fpp hg status | fpp git grep "FooBar" | fpp grep -r "FooBar" . | fpp git diff HEAD~1 --stat | fpp find . -iname "*.js" | fpp arc inlines | fpp 还有其他您可以梦想的东西
一个Js文件函数中调用另一个Js文件函数的方法演示
01-19
我们知道，在html中，利用[removed][removed]引入的两个js是不可以相互调用的。那么该如何解决呢？当然，你可以将代码通通copy过来，也许你并不喜欢这样。 例如有这样一个html，里面有一个按钮，当按下时调用b.js文件中的方法b()。而b()中又要调用a.js文件中的方法a()。若要实现这个功能，必须注意，将要引入的Js文件代码放在</body>下面。 　　首先，我们在html中引入b.js，并在</body>之后加入引用语句。如下： <html>
python文件选择对话框的操作方法
01-01
对于python的tkinter库来说，如果需要弹出文件选择框，我们需要引入一下tkinter.filedialog包，让用户直观地先择一个或者多个文件或者保存文件等操作。 常见的文件选择对话框函数有 **打开一个文件：**askopenfilename() **打开一组文件：**askopenfilenames() **保存文件：**asksaveasfilename() 首先是打开一个文件我们将使用的对话函数是askopenfilename() from tkinter import * import tkinter.filedialog root = Tk() def xz(): f
python 文件选择器,使用Qt-GUI的Python程序中的简单文件浏览器/文件选择器？
weixin_39960145的博客
12-15 307
I'm currently trying to implement some kind of file browser / "explorer" into a programme... I'm using Python and PySide in connection with the Qt-window-toolkit. More or less this youtube-video shows...
chatgpt赋能python：手动选择文件的Python应用介绍
最新发布
vacvefito的博客
06-20 256
本文由chatgpt生成，文章没有在chatgpt生成的基础上进行任何的修改。以上只是chatgpt能力的冰山一角。作为通用的Aigc大模型，只是展现它原本的实力。对于颠覆工作方式的ChatGPT，应该选择拥抱而不是抗拒，未来属于“会用”AI的人。🧡AI职场汇报智能办公文案写作效率提升教程 🧡专注于AI+职场+办公方向。下图是课程的整体大纲下图是AI职场汇报智能办公文案写作效率提升教程中用到的ai工具。
《Python+Kivy(App开发)从入门到实践》自学笔记：高级UX部件——FileChooser文件选择器
lstef的博客
11-06 1170
《Python+Kivy(App开发)从入门到实践》自学笔记：高级UX部件——FileChooser文件选择器
python选择一个文件
毛豆豆的博客
03-15 1738
from PyQt5.QtWidgets import * from PyQt5.QtGui import * from PyQt5.QtCore import * import sys,os class SelectDialog(QDialog): def __init__(self, parent=None): super(SelectDialog, self).__i...
CSS文件引入方式详解：行内、内部与外部样式表
"这篇文章主要讲解了CSS文件的三种引入方式：行内样式、内部样式表和外部样式表，包括每种方式的使用方法和示例。" 在网页设计中，CSS（Cascading Style Sheets）是用于控制网页元素外观的重要工具。理解并熟练掌握...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值