JS 控制CSS样式表
JS控制CSS所使用的方法:
<style>
.rule{
display: none;
}
</style>
你想要改变把他的display属性由none改为inline。
解决办法: 在IE里:
document.styleSheets[0].rules[0].style.display = "inline";
在firefox里:
document.styleSheets[0].cssRules[0].style.display = "inline";
可以做一个函数来搜索特定名字的style对象:
function getstyle(sname) {
for (var i=0;i<document.styleSheets.length;i++) {
var rules;
if (document.styleSheets[i].cssRules) {
rules = document.styleSheets[i].cssRules;
} else {
rules = document.styleSheets[i].rules;
}
for (var j=0;j<rules.length;j++) {
if (rules[j].selectorText == sname) {
//selectorText 属性的作用是对一个选择的地址进行替换.意思应该是获取RULES[J]的CLASSNAME.有说错的地方欢迎指正
return rules[j].style;
}
}
}
}
然后只要:
getstyle("rule").display = "inline";
注意 document.styleSheets[0].rules[0].style 这个 styleSheets[0]数组的下标是代表本页的第N个CSS样式表,它的下级rules[0]的数组下标表示的则是这个样式表中的第N个样式,例如:
<style type="text/css">
.s{display="none";}
.w{display="none";}
</style>
修改S则: document.styleSheets[0].rules[0].style.display='inline';
修改W则:document.styleSheets[0].rules[1].style.display = 'inline';
注意:CSS和HTML结合的方式必须为<LINK rel="stylesheet" type="text/css" href="" /> 或<style></style>的时候以上方法可行.
JS 控制CSS样式表的更多相关文章
- JS 对html标签的属性的干预以及JS 对CSS 样式表属性的干预
-任何标签的任何属性都可以修改! -HTML里是怎么写, JS就怎么写 以下是一段js 作用于 css 的 href的 代码 <link id="l1" rel= ...
- Vue.js 控制css样式
<script src="https://unpkg.com/vue/dist/vue.js"></script> <style type=" ...
- 漂亮的表格样式–>使用CSS样式表控制表格样式
依照WEB2.0风格,设计了几个表格样式,希望大家喜欢.WEB2.0提倡使用div开布局,但不是要完全放弃使用表格,表格在数据展现方面还是不错的选择.现在介绍使用CSS样式表来控制.美化表格的方法. ...
- 美丽的表格样式(使用CSS样式表控制表格样式)
按照WEB2.0风格,设计了几个表格样式,希望大家喜欢. WEB2.0提倡使用div开布局,但不是要全然放弃使用表格,表格在数据展现方面还是不错的选择. 如今使用介绍使用CSS样式表来控制.美化表格的 ...
- 漂亮的表格样式(使用CSS样式表控制表格样式)
根据WEB2.0风格,设计了几个表格样式,我希望你喜欢. WEB2.0推广使用div开放式布局.但并不是完全放弃使用形式,在数据表现形式而言是一个不错的选择. 本节将介绍如何使用现在CSS样式表来控制 ...
- 用JS控制CSS基本样式
详见:http://blog.yemou.net/article/query/info/tytfjhfascvhzxcytp29 用JS控制CSS基本样式的方法 CSS code .class1 { ...
- CSS样式表、JS脚本加载顺序与SpringMVC在URL路径中传参数与SpringMVC 拦截器
CSS样式表和JS脚本加载顺序 Css样式表文件要在<head>中先加载,这样网页显示时可以第一次就渲染出正确的布局和样式,网页就不会闪烁,或跳变 JS脚本尽可能放在<body> ...
- CSS样式表初学,比C#和JS简单
今天咱们一起来看下CSS样式表的基本基础 经常看博客或者喜欢钻研代码这一类的人对CSS可能有所耳闻,但具体的可能不是很清楚 那什么是CSS呢?与HTML又有什么区别呢?今天咱们就来说道下这个CSS C ...
- CSS样式表的写作规范
推荐大家使用的CSS书写规范.顺序 写了这么久的CSS,但自己都没有按照良好的CSS书写规范来写CSS代码,东写一段西写一段,命名也是想到什么写什么,过一段时间自己都不知道写的是那一块内容, 这样会影 ...
随机推荐
- 移动端1px
移动端不同尺寸设备dpi不同,会造成1px线条不同程度的缩放,可利用媒体查询device-pixel-ratio,进行不同情况匹配: @media(-webkit-min-device-pixel-r ...
- java第一天学习作业及答案
作业一 一.选择题 1.选出在java中有效的注释声明(AD)(选两项) A.//这是注释 B.*/这是注释*/ C./这是注释 D./*这是注释*/ 2.在控制台运行一个java程序,使用的命名正确 ...
- 关于升级xcode8
升级xcode8已是必然,升级ios10的用户不能说大有人在,应该也不会少,如果不升级xcode8,上架最新的包,那么可能应用在ios10 上是不支持的.so,这些xcode8的新特性,你应该了解!! ...
- 破解Outlook数据文件密码/PST访问密码
不少人会经常用outlook,邮件多的时候可能不定期导出一个PST文件,为安全起见,给PST文件设置访问密码,可是时间长了,难免忘记,怎么办呢?不用担心,你自己就可以解决,无论是Outlook97.O ...
- matlab初学之plot颜色和线型
文章出处: http://jiangshuxia.9.blog.163.com/blog/static/3487586020116711375339/ 字母 颜色 标点 ...
- 【zz】matlab 腐蚀膨胀算法
1.图像膨胀的Matlab实现: 可以使用imdilate函数进行图像膨胀,imdilate函数需要两个基本输入参数,即待处理的输入图像和结构元素对象.结构元素对象可以是strel函数返回的对象,也可 ...
- iOS学习之block
Block是C语言的扩充功能.带有自动变量(局部变量)的匿名函数.(不带有名称的函数) 非匿名函数:int func(int count):(声明了名称为func的函数)使用:int result = ...
- React学习——ListView(Reflux)
接前一篇,把前面的ListView改成Reflux的形式 var BookActions=Reflux.createActions([ 'fetchList' ]); var BookStore = ...
- 浅谈javascript中事件冒泡与事件捕获
事件冒泡:一个事件会顺着他的层级一直往上传,一直传到document上为止,即从盒模型上看是从内到外的过程. 例: <!DOCTYPE html><html lang="e ...
- react native 之子组件和父组件之间的通信
react native开发中,为了封装性经常需要自定义组件,这样就会出现父组件和子组件,那么怎么在父组件和子组件之间相互通信呢,也就是怎么在各自界面push和pop.传值. 父组件传递给子组件: 父 ...