<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. BZOJ 1003 物流运输 (动态规划 SPFA 最短路)

    1003: [ZJOI2006]物流运输 Time Limit: 10 Sec Memory Limit: 162 MB Submit: 5590 Solved: 2293 [Submit][Stat ...

  2. C#将十六进制的文本转换到整型数据

    1 length1 = Int32.Parse(szLine.Substring(1, 2), System.Globalization.NumberStyles.HexNumber);//计算这一行 ...

  3. [总结]Map: C++ V.S. Java

    整理一下Map在Java 和 C++的基本操作,欢迎大家一起交流学习. 附: 对于在C++中,选用map 还是 unordered_map,可以参考这篇讨论.相对简单粗暴的结论是,unordered_ ...

  4. CMS设计-组件化

    原来CMS使用的专题类的页面是 : 事先由前端写好完整页面,再交付给运营使用,这样使用的比较灵活,可以根据市场的不同需求由前端切出不同的页面,有时候一旦需求过多,就耽误切图的时间. 现在M和H5采用组 ...

  5. 异步编程设计模式Demo - AsyncComponentSample

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.C ...

  6. Jasper_chart_create a new stacked chart

    How to make a stacked chart 1, prepare data Source here we will create a csv file. 2, import/configu ...

  7. List myList=new ArrayList（）的理解

    ArrayList不是继承List接口,是实现了List接口.你写成ArrayList arrayList = new ArrayList();这样不会有任何问题.和List list = new A ...

  8. 查询反模式 - 正视NULL值

    一.提出问题 不可避免地,我们都数据库总有一些字段是没有值的.不管是插入一个不完整的行,还是有些列可以合法地拥有一些无效值.SQL 支持一个特殊的空值,就是NULL. 在很多时候,NULL值导致我们的 ...

  9. AQS详解

    一.概述 谈到并发,不得不谈ReentrantLock:而谈到ReentrantLock,不得不谈AbstractQueuedSynchronized(AQS)! 类如其名,抽象的队列式的同步器,AQ ...

  10. CString 的一些事

    MFC Visual Studio 2008 CString 的 Format 中不能这样存在str.Format(_T("Cool(\%)"));  或者 str.Format( ...