欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

html动态加载css样式和js脚本示例_HTML/Xhtml_网页制作

程序员文章站 2022-03-19 13:33:43
...
一、动态加载脚本

当网站需求变大,脚本的需求也逐步变大。我们就不得不引入太多的 JS 脚本而降低了整站的性能,所以就出现了动态脚本的概念,在适时的时候加载相应的脚本。
比如:我们想在需要检测浏览器的时候,再引入检测文件。


复制代码
代码如下:

动态执行 js


IE 6,7,8浏览器认为 script 是特殊元素,不能在访问子节点。为了兼容,可以使用 text属性来代替。


需要做所有浏览器兼容

二、动态加载样式

为了动态的加载样式表,比如切换网站皮肤。样式表有两种方式进行加载,一种是标签,一种是

动态执行 link


复制代码
代码如下:

var flag = true;
if (flag) {
loadStyles('basic.css');
}
function loadStyles(url) {
var link = document.createElement('link');link.rel = 'stylesheet';
link.type = 'text/css';
link.href = url;
document.getElementsByTagName('head')[0].appendChild(link);
}


动态执行 style


复制代码
代码如下: