<html>

　　<head>

　　<link rel="stylesheet" type="text/css" href="basic.css">

　　　　<script>

　　　　　　window.onload=function(){

　　　　　　　　　　　var sheet=document.styleSheets[0];

　　　　　　　　　　　//【新增样式规则】

　　　　　　　　　　//　sheet.insertRule('.div1{font-size:16px;color:red;}',0);　　　　  IE8及以上不支持　　//第一个参数是样式，第二个是样式的位置

　　　　　　　　　   //　sheet.addRule('.div1','font-size:20px;color:orange;font-weight:bold;',0);　　　　//IE都支持　　　　//第一个参数是样式名，第二个样式位置是样式规则，第三个是样式位置

　　　　　　　　　　　function insertCss(element,csName,position){　　　　　　　　　　　　　　　　　　　　　　　　//跨浏览器兼容　　　　　　

　　　　　　　　　　　　　if(sheet.insertRule){　　　　　　　　　　　　　　　　　　　　    // sheet.insertRule  非IE的时候会读取到一个函数，IE8即以上的时候会读取到undefined

　　　　　　　　　　　　sheet.insertRule(element+'{'+csName+'}',position);　　　　

　　　　　　　　　　}else if(sheet.addRule){　　　　　　　　　　　　　　　　　　　　　　

　　　　　　　　　　　　sheet.addRule(element,csName,position);

　　　　　　　　　　}

　　　　}

　　　　　　　　insertCss('.div1','font-size:16px;color:orange',0);

　　　　　　　　　//【删除样式规则】

　　　　　　　　//sheet.deleteRule(position)  ;  //删除样式  参数为位置　　　　　　　　//IE8及以上不支持

　　　　　　　　//sheet.removeRule(position) ; //删除样式  参数为位置　　　　　　　　//IE支持

　　　　　　　　function deleteCss(position){　　　　　　　　//跨浏览器兼容

　　　　　　　　if(sheet.deleteRule){　　　　　　　　

　　　　　　　　　　　sheet.deleteRule(position);

　　　　　　}else if(sheet.removeRule){

　　　　　　　　　　sheet.removeRule(position);

　　　　　　}　　

　　　　deleteCss(0);

　　　　}

　　　　　　　　

}

　　　　</script>

　　</head>

　　<body></body>

</html>

javaScript增加样式规则(新增样式)的更多相关文章

  1. css样式规则的简要总结

    css与文档关联起来发挥作用. css文件中是各种样式规则,由选择器和声名块构成.声明块由多条声明组成.选择器是声明要作用的对象,声明是对具体规则的描述. 声明由属性和值组成,值或是属性的错误都会使该 ...

  2. iOS13适配/黑暗模式的适配/KVC访问私有属性/模态弹窗ViewController 默认样式改变 /LaunchImage即将废弃/蓝牙的权限申请/推送Device Token适配/UIKit 控件变化/StatusBar新增样式

    目录 1. KVC访问私有属性 2. 模态弹窗ViewController 默认样式改变 3. 黑暗模式的适配 4. LaunchImage即将废弃 5. 新增一直使用蓝牙的权限申请 6. Sign ...

  3. javascript中获取非行间样式的方法

    我们都知道一般在javascript中获取样式一般用的是nodeObj.style.attr这个属性的,但是这个属性只能获取行间样式非行间样式比如写在样式表中的样式那么用nodeObj.style.a ...

  4. javascript获取元素的计算样式

    使用css控制页面有4种方式,分别为行内样式(内联样式).内嵌式.链接式.导入式. 行内样式(内联样式)即写在html标签中的style属性中,如<div style="width:1 ...

  5. javascript改变style样式和css样式

    转载 在很多情况下,都需要对网页上元素的样式进行动态的修改.在JavaScript中提供几种方式动态的修改样式,下面将介绍方法的使用.效果.以及缺陷. 1.使用obj.className来修改样式表的 ...

  6. js | javascript改变style样式和css样式

    转载 在很多情况下,都需要对网页上元素的样式进行动态的修改.在JavaScript中提供几种方式动态的修改样式,下面将介绍方法的使用.效果.以及缺陷. 1.使用obj.className来修改样式表的 ...

  7. css样式规则

    在css样式规则中: 1.选择器用于指定CSS样式作用的HTML对象,花括号内是对该对象设置的具体样式. 2.属性和属性值以"键值对"的形式出现. 3.属性是对指定的对象设置的样式 ...

  8. 2.1.4- css 样式规则

    CSS初识 CSS(Cascading Style Sheets) CSS通常称为CSS样式表或层叠样式表(级联样式表),主要用于设置HTML页面中的文本内容(字体.大小.对齐方式等).图片的外形(宽 ...

  9. JavaScript 学习—— js获取行间样式和非行间样式

    1. 问题引入 <head> <style> #div1{ width:150px; height:200px; position:absolute; left:-150px; ...

随机推荐

  1. cell的各种使用和赋值 总结

    cell可以分为:自定义cell,系统的cell ,cell的自适应,.xib的cell //第一种cell:系统cell 在 UIViewController下创建UITableView //1.0 ...

  2. Http Clinet使用

    Http Client是个apache下的一个开源包,用于使用http协议访问服务的java代码编写. Http Client的主要功能: (1)实现了所有 HTTP 的方法(GET,POST,PUT ...

  3. 关于extern对变量的使用

    extern 是声明全局的变量的意思. 例如在一个工程中有两个cpp,一个是test.cpp一个是main.cpp . 我们在test.cpp中定义了一个int num;但是我们在main.cpp中想 ...

  4. DOM 其他一些特性

    cookie 允许javascript程序读写HTTP cookie 的特殊的属性 domain 允许当Web页面之间交互时,相同域名下相互信任的Web服务器之间协作放宽同源策略安全限制 (JavaS ...

  5. VMware 虚拟机使用RedHat，出现 connect: Network is unreachable解決方法

    http://www.linuxidc.com/Linux/2015-02/113119.htm http://www.osyunwei.com/archives/7829.html

  6. 微信分享jssdk config:invalid signature 签名错误

    使用微信分享时,按照官方给的demo,使用时一直提示签名错误. 根据微信开发文档(http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd ...

  7. JS 多种变量定义

    对象直接量创建一个对象:  var obj = {x:[1,2],y:23}; 代码跟下面是一样的.  var obj=new Object(); obj.x=new Array(1,2); obj. ...

  8. CSU 1335 高桥和低桥

    开始队友说是线段树,看了看貌似也是,上手敲了个嵌套的线段树,O(nlognlogn)的复杂度果断tle了 TAT 思路:对h[i]排序,对每次涨水退水,先用二分查找,再用一个数组保存当前点之后所有点被 ...

  9. linux中查找命令find、locate、whereis、which、type区别

    linux中查找命令find.locate.whereis.which.type区别 1. find Java代码 find是最常见和最强大的查找命令,你可以用它找到任何你想找的文件.与查询数据库(/ ...

  10. NOD32强制卸载工具使用方法【转】

    装了ESET NOD32又忘记密码了,无法卸载,怎么办? 以下转自官网:http://faq.eset.com.cn/index.php?pid=254 [适用产品:ESET NOD32 防病毒软件4 ...