浅析前台中使用js/jq动态加载js、css文件

  • 时间:2018-06-06 01:59 作者:维新掌柜 来源:维新掌柜 阅读:184
  • 扫一扫,手机访问
摘要:因思维新建站官网:www.inspinovation.cn文|鲁掌柜在前台开发中,通常css文件都是写在head区,js文件都是写在之前,这样能提高网页加载的效率,优先加载dom元素,给使用户较好的体验,但是有时候有的时候js/css不是一开始就必需加载的,这种时候即可以选择用js或者者jq对js/

因思维新建站官网:www.inspinovation.cn

文|鲁掌柜

在前台开发中,通常css文件都是写在head区,js文件都是写在之前,这样能提高网页加载的效率,优先加载dom元素,给使用户较好的体验,但是有时候有的时候js/css不是一开始就必需加载的,这种时候即可以选择用js或者者jq对js/css文件进行动态的加载,方式也比较简单,下面先来说下js加载css/js文件。

JS 方式加载 CSS、JS 文件:

//加载 css 文件

浅析前台中使用js/jq动态加载js、css文件

//加载 js 文件

浅析前台中使用js/jq动态加载js、css文件

用上面这种js加载文件的方式很方便,但是也没那么稳固,有可可以会在加载完成js文件之后,有少量内部的方法丢失,从而找不到方法而报错,这是由于在加载文件的时候假如网络不稳固,会造成部分代码的丢失,所以该方法不建议用。下面简单说下jq加载的方式

JQuery 加载 CSS 文件:

浅析前台中使用js/jq动态加载js、css文件

Jquery 加载 JS 文件,有两种方式:

浅析前台中使用js/jq动态加载js、css文件

上面是jq加载文件的两种方式,都是可行的,并且加载完成之后再执行方法,相比基础的js加载的方式,稳固了许多。假如需要一次加载多个文件,操作也比较简单,这里不得不佩服jq开发者的强大,为我们带来这么方便的js库。一次加载多个文件用jq的方法如下

浅析前台中使用js/jq动态加载js、css文件

假如需要屡次调使用多个文件,也能将方法独立开来

//定义方法

浅析前台中使用js/jq动态加载js、css文件

//调使用方法

浅析前台中使用js/jq动态加载js、css文件

用js/jq动态调使用文件的方式就说这么多啦,假如有更好的欢迎补充~

浅析前台中使用js/jq动态加载js、css文件

  • 全部评论(0)
最新发布的资讯信息
【系统环境|服务器应用】Discuz发布帖子时默认显示第一个主题分类的修改方法(2019-12-09 00:13)
【系统环境|软件环境】Android | App内存优化 之 内存泄漏 要点概述 以及 处理实战(2019-12-04 14:27)
【系统环境|软件环境】MySQL InnoDB 事务(2019-12-04 14:26)
【系统环境|软件环境】vue-router(单页面应用控制中心)常见用法(2019-12-04 14:26)
【系统环境|软件环境】Linux中的Kill命令(2019-12-04 14:26)
【系统环境|软件环境】Linux 入门时必学60个文件解决命令(2019-12-04 14:26)
【系统环境|软件环境】更新版ThreeJS 3D粒子波浪动画(2019-12-04 14:26)
【系统环境|软件环境】前台开发WebStorm常用快捷键,火速收藏!(2019-12-04 14:25)
【系统环境|软件环境】微博H5登录和发微博组件(2019-12-04 14:25)
【系统环境|软件环境】5分钟谈前台面试,小伙伴都惊呆了(2019-12-04 14:23)
手机二维码手机访问领取大礼包
返回顶部