强化模板Load加载JS和CSS【仅供菜鸟级】ThinkPHP3.2

浏览:7282 最后更新:2018-12-26 10:58 分类:模式 关键字: 加载JS和CSS Load修改 ThinkPHP3.2 强化模板
小编使用的是最新的ThinkPHP3.2版本。
小编在使用的过程里发现Load载入JS和CSS,感觉非常好用。但是说实话,在设计的过程里,还是有点欠缺。因为缓冲问题。调试JS和CSS,老是需要清除缓冲才能看到效果。很烦恼。因此小编决定给Load加调试属性,让Load的调用更加适合调试。
首先,我们在自己的程序页面目录里,加载好一个View先,以知道自己的效果是否成立嘛!~

/Uploads/editor/2014-08-14/53ec792d2a389.jpg放大查看
接着在这里编写load的调用罗!<load href="//code.jquery.com/jquery-1.10.2.min.js" G="true" />其中G这个是小编新增的属性项目。
true就是开启调试模式。
接着到ThinkPHP/Library/Think/Template/TagLib/Cx.class.php 的修改罗!~这个很关键喔!是否生效就看这个罗!
1、把第38行'import'    =>  array('attr'=>'file,href,type,value,basepath','close'=>0,'alias'=>'load,css,js'),修改为'import'    =>  array('attr'=>'file,href,type,value,basepath,g','close'=>0,'alias'=>'load,css,js'),对啦!~就是在里面加一个‘g’的基础属性。
2、在454行那里修改。$FileID     =   '';修改为$FileID     =   '';
        //是否启用随机
        if(isset($tag['g'])){
            if(strtolower($tag['g'])=='true'){
                $g='?'.date("YmdHis").rand(100,999);
            }
        }
这个作用很简单,就是获取g是否为真,是否开启调试模式。
3、把483行到487行也修改了case 'js':
                    $parseStr .= '<script type="text/javascript" src="'.$val.'"></script>';
                    break;
                case 'css':
                    $parseStr .= '<link rel="stylesheet" type="text/css" href="'.$val.'" />';
改为case 'js':
                    $parseStr .= '<script type="text/javascript" src="'.$val.$g.'"></script>';
                    break;
                case 'css':
                    $parseStr .= '<link rel="stylesheet" type="text/css" href="'.$val.$g.'" />';
好了!~基本完成了!
再用firebug测试一下!~

其实原理很简单,就是在加载JS或者CSS的内容上,加上随机的东西下去,让他不重复,从而获得强制加载的效果。
这样做就省去了调试清除缓冲的烦恼了。
不过记得模板设计好了以后,记住要把g的开启状态删除喔!
不然亲的网站会很慢的。访问亲那个页面都需要加载JS和CSS,访客会很纠结的喔。
关闭也很简单,可以直接把‘g’属性内容部分删除就可以了。
评论( 相关
后面还有条评论,点击查看>>