动态改变外部的样式表

最新推荐文章于 2024-07-21 19:13:42 发布

hackerster

最新推荐文章于 2024-07-21 19:13:42 发布

阅读量298

点赞数 1

文章标签： stylesheet css function jquery button 浏览器

本文链接：https://blog.csdn.net/hackerster/article/details/7061327

版权

一个网页可能用到多个外部样式表，在浏览器客户端如何动态的选择不同的外部样式表呢！

思路：导入到网页中的css文件被解析为sytelSheet对象。首先将要用到的css样式表都导入。然后利用document.styleSheets来获取所有的样式表(利用索引就可以访问单个的styleSheet对象)。设置styleSheet对象的disabled属性来禁用/启用某个sytelSheet对象。

css1.css文件代码:

body{ color:blue; }

css2.css文件代码

body{ color:red; }

html文件(给按钮绑定事件是用到jquery):

<html> <head> <link href="css1.css" mce_href="css1.css" rel="stylesheet" type="text/css"> <link href="css2.css" mce_href="css2.css" rel="stylesheet" type="text/css"> <mce:script type="text/javascript" src="jquery-1.5.1.min.js" mce_src="jquery-1.5.1.min.js"></mce:script> <mce:script type="text/javascript"></mce:script> </head> <body> asdfasd; <button>blue</button> <button>red</button> </body> </html>

咋代码里多了这么过:mce:和mce_什么的，复制的话点击上面的copy to clipboard赋值出来的东西是oK的

hackerster

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
动态改变外部的样式表

一个网页可能用到多个外部样式表，在浏览器客户端如何动态的选择不同的外部样式表呢！思路：导入到网页中的css文件被解析为sytelSheet对象。首先将要用到的css样式表都导入。然后利用document.styleSheets来获取所有的样式表(利用索引就可以访问单个的styleSheet对象)。设置styleSheet对象的disabled属性来禁用/启用某个sytelSheet对象。c
复制链接

扫一扫