1.  
  1. //autoload.js
  1. ;! function(e) {
  2. var autoload = e.autoload || {};
  3. e.autoload = autoload;
  4. e.autoload = new function() {
  5. this.options = {
  6. id: 'autoload',
  7. }
  8. var o = this.options;
  9. this.include = function(_opt) {
  10. o = _opt;
  11. var id = document.getElementById('autoload');
  12. if(typeof id!=='undefined'){
  13. var cssid = id.getAttribute('css');
  14. var jsid = id.getAttribute('js');
  15. }
  16. cssid = autoload.split(cssid);
  17. jsid = autoload.split(jsid);
  18. var c = 0; //记录js的起始位置
  19. for(var i = 0; i < o.path.length; i++) {
  20. var file = o.path[i];
  21.  
  22. if (file.match(/.*.js$/)){
  23. var ind = i+1-c; //记录js的起始位置
  24. if(jsid.toString().indexOf(ind)>-1){ //判断id中的js链接是否存在
  25. document.write('<script type="text/javascript" src="' + file + '"></script>');
  26. }
  27. }else if (file.match(/.*.css$/)){
  28. c++;
  29. if(cssid.toString().indexOf(i+1)>-1){
  30. var Link = document.createElement('link');
  31. Link.href = o.path[i];
  32. Link.rel = 'stylesheet';
  33. document.getElementsByTagName('head')[0].appendChild(Link);
  34. }
  35. }
  36. }
  37. }
  38. }
  39. autoload.split = function(str){
  40. var strs= new Array(); //定义一数组
  41. strs=str.split(","); //字符分割
  42. return strs;
  43. }
  44. }(window)
  45.  
  46. //调用
  47. autoload.include({
  48. id: 'autoload' //引入的该js的id
  49. //引入的路径
  50. ,path: [
  51. 'css/a.css'
  52. ,'css/b.css'
  53. ,'js/1.js'
  54. ,'js/2.js'
  55. ,'js/3.js'
  56. ,'js/4.js'
  57. ,'js/5.js'
  58. ]
  59. });
  1. </body>前引入,js和css为path中参数的位置,例中js位置为1,2,4从1开始查找,css同理。
  1. <script src="js/autoload.js" id="autoload" js="1,2,4" css="1,2"></script>
  1.  

纯js自动批量引入js、css插件,支持自定义参数的更多相关文章

  1. babel配置项目目录支持转换es6语法,引入非项目目录js后,引入Js转换无效

    我遇到了一个问题,我在已经配置babel的项目中通过require引入了一个项目目录外层的另一个js文件,前期是可以成功转换并打包的,但是到了后期就不行了,报错: 这个报错的意思是,引入的js文件中有 ...

  2. Windows使用Node.js自动生成Vue.js模版环境部署步骤-----记录

    node.js官网下载并安装node 进入node文档目录下,运行cmd 输入 node -v 查看node版本 出现表示安装完成 输入 npm -v 显示npm版本信息 安装cnpm 输入 npm ...

  3. 页面中引入js的几种方法

    通常大家最为熟悉的是一下两种方法: 在页面中直接写入<script type="text/javascript">js代码</script>. 在页面中引入 ...

  4. 解决低版本IE关于html5新特性的兼容性问题html5shiv.js和Respond.js,以及excanvas.js解决低版本IE不支持canvas的问题

    插件:html5shiv.js 让IE9以下版本支持html5新标签,git地址https://github.com/aFarkas/html5shiv 用于解决IE9以下版本浏览器对HTML5新增标 ...

  5. PHP 多图上传,图片批量上传插件,webuploader.js,百度文件上传插件

    PHP  多图上传,图片批量上传插件,webuploader.js,百度文件上传插件(案例教程) WebUploader作用:http://fex.baidu.com/webuploader/gett ...

  6. js自动生成条形码插件-JsBarcode

    JsBarcode.html <!DOCTYPE html> <html lang="en"> <head> <meta charset= ...

  7. 自己编写jQuery动态引入js文件插件 (jquery.import.dynamic.script)

    这个插件主要是结合jquery或者xhr异步请求来使用的,它可以把已经引入过的js文件记录在浏览器内存中,当下次再引入相同的文件就忽略该文件的引入. 此插件不支持浏览器刷新保存数据,那需要利用cook ...

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

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

  9. Google Pagespeed,自动压缩优化JS/CSS/Image

    Google Pagespeed,自动压缩优化JS/CSS/Image 浏览: 发布日期:// 分类:技术分享 关键字: Nginx Appache Pagespeed 自动压缩优化JS/CSS/Im ...

随机推荐

  1. pymysql的使用及sql注入

    pymysql简介 pymysql是python操纵mysql的一个模块,本质上是一个socket客户端 pymysql使用 准备数据 #创建数据库db2,如果已存在,请忽略 CREATE DATAB ...

  2. java中<T> T和T的区别

    如果希望 getMax 方法的返回值类型为 T,就要这样去定义getMax方法: public T getMax() 如果希望 getMax 方法返回值的类型由调用者决定,那么就这么去定义 getMa ...

  3. 调用腾讯、百度翻译API,实现游戏机翻通用程序

    最近玩了款steam独立游戏,没中文,只能自己汉化了,用腾讯跟百度的API实现了一个通用的机翻程序(只需要导入JSON文本), 同样,比较懒,还没写,先占坑

  4. vue中使用swiper-slide时,循环轮播失效?

    前言 vue 项目中使用时,组件swiper-slide 如果用v-for循环的话,loop:true 就不能无缝轮播,每次轮播到最后一张就停止了??? 正文 代码如下: <swiper :op ...

  5. 工作经验-类型转换[ java.lang.String]

    错误代码: logger.info("1"); Map<String,String> zxmap = (Map) zxList.get(0); ybty.setFyze ...

  6. python 读写文件中 w与wt ; r与rt 的区别

    w,r,wt,rt都是python里面文件操作的模式.w是写模式,r是读模式.t是windows平台特有的所谓text mode(文本模式),区别在于会自动识别windows平台的换行符.类Unix平 ...

  7. CIA402状态转换图

    CIA402状态转换如下图所示: 要想改变参数并使其生效,需要先将状态转换到ready,然后修改要配置的参数,再使其运行(operation enabled). 要发送的报文顺序基本如下: 1)   ...

  8. C++中几个输入函数的用法和区别(cin、cin.get()、cin.getline()、getline()、gets()、getchar())

    1.cin>> 用法1:最基本,也是最常用的用法,输入一个数字: #include <iostream>using namespace std;main (){int a,b; ...

  9. 树上背包O(n*m^2)|| 多叉树转二叉树 || o(n*m)???

    #. 选课 描述 提交 自定义测试 问题描述 在大学里每个学生,为了达到一定的学分,必须从很多课程里选择一些课程来学习,在课程里有些课程必须在某些课程之前学习,如高等数学总是在其它课程之前学习.现在有 ...

  10. python---哈希算法实现

    # coding = utf-8 class Array: def __init__(self, size=32, init=None): self._size = size self._items ...