诸如以下功能:某门户网的个人站点提供用户自定义模板功能.当用户选择模板时,列出多种模板以供选择,点击模板后可以预览;这种做法可以如下:
1)每点一个模板时,将选择的模板存放在数据库中,然后页面刷新以重新加载;页面读取数据库中记录以加载相应的css,js;但代价颇大;因为每点一次都要刷新,用户体验不好,而且每点一次都要进行数据库操作;
2)点后在JS函数中对页面进行相应的css,js 引用,以改变风格;用户取消预览只需去掉就可;
JS动态引用css,js 文件方法如下:
因为html中引用外部css,js文件均在<head></head>中添加:
<link href="**.css" type="text/css" rel="stylesheet"></link>
或:<script type="text/javascript" src="**.js"></script>
动态加载的想法也是一样.只不过是通过js创建相应的标签,然后将标签绑定到head下;
function loadExtentFile(filePath, fileType){
if(fileType == "js"){
var oJs = document.create_rElement('script');
oJs.setAttribute("type","text/javascript");
oJs.setAttribute("src", filename);//文件的地址 ,可为绝对及相对路径
document.getElementsByTagName_r("head")[0].appendChild(oJs);//绑定
}else if(fileType == "css"){
var oCss = document.create_rElement("link");
oCss.setAttribute("rel", "stylesheet");
oCss.setAttribute("type", "text/css");
oCss.setAttribute("href", filename);
document.getElementsByTagName_r("head")[0].appendChild(oCss);//绑定
}
}
loadExtentFile("js/func.js", "js");
loadExtentFile("default.css", "css");
清空:
var lists = document.getElementsByTagName_r("link");
for ( var i = 0; i < lists.length; i++) {
if (lists[i].getAttribute("href").indexOf(".css") != -1) == -1) {
lists[i].parentNode.removeChild(lists[i]);
}
}
上面的判断语句中可以加入自己的判断,如:只想去掉temp.css;则可以判断href中是否包括temp.css等;JS 判断方法和上面的差不多.
相关推荐
当项目js（css）文件使用越来越多，js 文件的加载也成了性能上的一个问题，此资源能够在页面全部加载完成后异步加载js等资源文件，它可以顺序加载资源列表，也可以并发加载资源列表，它包含一个方法调用接口：...
JS动态加载CSS 在可换主题的界面中具有很重要的意义，用户可以根据自己的浏览习惯选择自己喜欢的页面显示方式，下面详细说明。 希望下面的方法对你有帮助。 （1）使用JavaScript动态加载Js文件 /*JavaScript动态...
1、动态加载js，css文件(用原生js和jquery) iframe结构： frame0(父) frame2（子） frame3（子） frame2中触发事件，动态的向frame3中 加载js、css文件和 dom元素？ *同级之间可以调用，可以 通过 子-父-子 的方式...
动态加载JS文件和CSS文件，多浏览器支持。多个JS文件同时加载，加载完成后执行回调方法。 使用方法: var loader=new RemoteLoader(); loader.loadFiles(["yy.js","jj.jus"],作用域);
// JavaScript Document ;(function($){ $.extend({ includePath: '', include: function(file) { var files = typeof file == "string" ? [file]:file; for (var i = 0; i ; i++) { var name = files[i]...
主要介绍了nginx 部署 vue 项目找不到js css文件的解决方法，本文给大家介绍的非常详细，具有一定的参考借鉴价值,需要的朋友可以参考下
asp.net后台代码动态引用添加JS和css文件
3、由于是页面是从上到下依次加载文件的，并且边加载边解释，所以可以添加javascript控制器控制页面文件的加载顺序，如先加载css布局文件，再显示有图片的css美化文件,之后再加载大的falsh文件，或者安内容的重要...
下面小编就为大家带来一篇JS 动态加载js文件和css文件 同步/异步的两种简单方式。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
本文详细介绍下，如何动态加载外部js文件及js；动态加载外部css样式及css样式，感兴趣的朋友可以参考下哈，希望对你学习js有所帮助
如果你有很多关联的CSS文件要一起加载，或者想动态的加载不同的CSS文件，那么下面的方法你一定对你有帮助。 Jquery动态加载Js和Css扩展方法 $.extend({ includePath: '', include: function(file) { var files ...
3.仿制js,css文件冲突和重复加载 如,zencart网站的下载安全的其他插件中,如果有两个都带有 同一个 javascript 文件(例如:jQuery),那么它将会被加载两次, 不过要使得这个功能生效的话,那么开发者必须都使用CJ Loader...
顶部加载条的js和css文件
动态添加JS文件和css文件的引用在asp.net后台如何实现呢？首先添加命名空间 using System.Web.UI.HtmlControls，之后按照下面的步骤操作即可
1. 用在外部CSS文件中加载必须的文件 @importurl(style.css); //只能用在CSS文件中或者style标签中 2. 简单的在页面中加载一个外部CSS文件 document.createStyleSheet(cssFile); 2. 用createElement方法创建CSS的...
jquery自带的getSrcript文件只能动态加载js代码，但不能加载css，后来自己写了一个可加载js与css的程序