<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. iPhoneKeyboard

    iPhoneKeyboard.Open static function Open (text : string, keyboardType : iPhoneKeyboardType = iPhoneK ...

  2. winPcap_1_开篇

    什么是WinPcap WinPcap是一个基于Win32平台的,用于捕获网络数据包并进行分析的开源库. 因为有些应用程序需要直接访问网络中的数据包.也就是说,那些应用程序需要访问原始数据包,即没有被操 ...

  3. 虚拟机安装centos

    linux安装 鉴于国内大多数服务器都使用的redhat系列作为操作系统,centos又是redhat的免费版本,所以可以学习一下.因为另一台古董电脑已经装了linuxmint,虽然也可以安装虚拟机, ...

  4. No2_4.接口继承多态_Java学习笔记_经典案例

    import java.lang.reflect.Field; import java.util.ArrayList; import java.util.Collections; import jav ...

  5. 【android】java.net.ConnectException: localhost/127.0.0.1:8080 - Connection refused

    调试中通过android simulator模拟器链接localhost或者127.0.0.1,因为我在电脑上面建立了apache,我的代码大概就是URL url = new URL(urlStrin ...

  6. Apache服务器安装配置（win版）

    登录http://httpd.apache.org/download.cgi 这个地址,找到2.4.10,如下图位置: 2 进入如下界面后,选择第一项ApacheHaus,这是个第三方下载平台,在它的 ...

  7. Lua 字符串函数小结

    1.求字符串长度 string.len(str) 2.大小写转换 string.upper(str) string.lower(str) 3.字符串查找(非全局) --func_string.lua ...

  8. python代码风格规范

    类注释模板: :: class AnotherClass: """ 类注释 """ def method(self, arg1, arg2, ...

  9. Python中range的用法

    函数原型:range(start, end, scan): 参数含义:start:计数从start开始.默认是从0开始.例如range(5)等价于range(0, 5); end:技术到end结束,但 ...

  10. 六度分离--hdu1869

    六度分离 Time Limit: 5000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Submis ...