`
flex_莫冲
  • 浏览: 1090293 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

js操作cssRule的增删改

 
阅读更多
initSize: function(){
                var sheet = null;
                for (var i = 0, len = document.styleSheets.length; i < len; i++) {
                    sheet = document.styleSheets[i];
                    if (sheet.href.indexOf('transitions') != -1) {
                        var rules = sheet.rules || sheet.cssRules;//取得规则列表
                        //修改样式表中的样式规则
                        var rule = rules[0];//取得第一条
                        rule.style.width = options.imageWidth + "px";
rule.style.height = options.imageHeight + "px";
rule = rules[1];//取得第2条
                        rule.style.width = options.imageWidth + "px";
rule.style.height = options.imageHeight + 80 + "px";
//删除前面两条rules。
//                        deleteRule(sheet, 0);
//                        deleteRule(sheet, 1);
//                        insertRule(sheet, ".imageSize", "width:" + options.imageWidth + ";" + "height:" + options.imageHeight + ";", 0);
//                        insertRule(sheet, ".wrapperSize", "width:" + options.imageWidth + ";" + "height:" + options.imageHeight + 80 + ";", 1);
                        console.log(sheet);
break;
                    }
                }
                function insertRule(sheet, selectorText, cssText, position){
                    if (sheet.insertRule) {
                        sheet.insertRule(selectorText + "{" + cssText + "}", position);
                    }
                    else
                        if (sheet.addRule) { //仅对IE有效
                            sheet.addRule(selectorText, cssText, position);
                        }
                }
                function deleteRule(sheet, index){
                    if (sheet.deleteRule) {
                        sheet.deleteRule(index);
                    }
                    else
                        if (sheet.removeRule) { //仅对IE有效
                            sheet.removeRule(index);
                        }
                }
            },
分享到:
评论

相关推荐

    html+css+js表格动态增删改与xml加载与保存

    总的来说,"html+css+js表格动态增删改与xml加载与保存"这个项目涵盖了网页开发中的基本技能,包括动态HTML操作、CSS美化、JavaScript事件处理和XML数据交互。掌握这些技术,能够帮助开发者构建具有强大功能和良好...

    js表格table的增删改

    ### JavaScript 操作 HTML 表格 (Table) 的增删改 在 Web 开发中,JavaScript 经常被用来实现对页面元素的动态操作,其中包括对 HTML 表格 (`&lt;table&gt;`) 的操作。通过 JavaScript,我们可以轻松地实现表格数据的添加...

    htmljavascript增删改

    JavaScript,作为客户端脚本语言,允许我们对HTML文档进行操作,实现数据的增删改功能,为用户提供实时反馈。在这个主题中,我们将深入探讨如何使用JavaScript来实现这些操作。 首先,让我们理解HTML的基础。HTML...

    实验训练3 数据增删改操作

    实验训练 3 数据增删改操作 本实验的主要目的是通过实践操作,掌握 MySQL 中的数据增删改操作,包括单记录插入、批量插入、删除、修改等操作。实验内容包括三个部分:插入数据、删除数据和修改数据。 实验 3-1 ...

    国家开放大学 MySQL数据库应用 实验训练3 数据增删改操作

    MySQL数据库应用实验训练3 数据增删改操作 MySQL数据库应用实验训练3 数据增删改操作是国家开放大学提供的实验训练,旨在让学生熟悉 MySQL 数据库的基本操作,包括数据的增删改操作。实验中,学生将学习使用 Insert...

    jquery写的增删改

    文件名 "jquery写的增删改" 暗示这是一个完整的示例,可能包括 HTML、CSS 和 JavaScript 文件,你可以通过学习和运行这些代码来理解 jQuery 增删改的具体实现。 总结来说,jQuery 提供的强大功能使得网页中的数据...

    table增删改操作

    table表格的增删改功能,鼠标左键双击可编辑,下方按钮增加,右侧删除,表格数据计入localstorage,不会因刷新而消失

    树的操作【菜单增删改拖动】.zip

    在本资源包"树的操作【菜单增删改拖动】.zip"中,我们重点关注的是如何在用户界面中实现树结构的动态操作,如增、删、改、拖动等交互功能。这些功能通常在文件管理器、组织结构展示、权限管理等场景中广泛使用。资源...

    自己整理的实例增删改

    【标题】"自己整理的实例增删改"指的是个人整理的一系列关于数据库操作或编程实践中的增、删、改操作实例。在IT行业中,增、删、改是数据操作的基本要素,通常涉及到数据库管理和编程语言的数据处理部分。 【描述】...

    ztree 支持右键 增删改操作

    在描述中提到的“ztree支持右键增删改操作”意味着ZTree允许用户通过鼠标右键点击节点来执行添加、删除和修改等操作,极大地提升了用户的交互体验和工作效率。 **ZTree的基本概念:** 1. **节点(Node)**:ZTree的...

    c#Form窗体增删改操作

    本教程将深入探讨如何在C#窗体模式下使用封装的方式对表格内容进行增删改操作,这对于初学者来说是一份很好的学习资源。教程中包含了一个数据库文件和详细的使用说明,确保你可以顺利地理解和应用这些概念。 首先,...

    实验训练3数据增删改操作.docx

    在本实验训练中,主要涉及的是关系型数据库管理系统MySQL中的数据操作,包括数据的增加(Insert)、删除(Delete)和修改(Update),这些都是数据库管理的基础且重要的操作。实验旨在加深对这些SQL语句的理解和应用...

    使用vue基础语句实现学生的增删改操作

    在本文中,我们将深入探讨如何使用Vue.js的基础语句来实现学生管理系统的增删改功能,并结合实时日志记录学生信息的变化。Vue.js是一个流行的前端JavaScript框架,它提供了声明式的数据绑定和组件化的能力,使得构建...

    用于增删改除的代码

    增删改除代码

    WPF 使用MVVM设计模式对进行增删改操作

    本主题主要关注如何在WPF项目中运用MVVM模式来实现数据的增删改操作,这对于理解和提升软件开发效率至关重要。 MVVM模式是一种将业务逻辑、用户界面和数据模型分离的设计思想。它由三个主要部分组成: 1. **Model...

    easyui增删改很好的例子

    在这个例子中,`产品列表`可能使用了`datagrid`组件来展示产品信息,它支持分页、排序和过滤功能,并可以通过内置的编辑功能进行增删改操作。 `产品分类管理`可能采用了类似的表格展示,但重点在于对分类的管理,这...

    django入门-增删改实例

    这个入门实例将引导我们了解如何利用Django进行用户信息的增删改操作,这也是Web应用中常见的功能需求。下面,我们将详细探讨这个主题。 首先,我们需要了解Django的基本结构。一个Django项目通常由多个应用程序...

    通用WEB表格增删改操作(附源码)

    本教程将探讨如何实现通用的Web表格的增删改操作,包括前端交互与后端处理,以及提供源码以供参考。 一、前端交互 前端交互主要涉及到HTML表格的创建、JavaScript或jQuery对表格元素的操作,以及AJAX与后端服务器的...

    GridControl增删改查到数据库

    "GridControl增删改查到数据库"这个主题聚焦于如何利用UI组件GridControl与LINQ to SQL技术来实现对数据库数据的CRUD(Create, Read, Update, Delete)操作。下面将详细解释相关知识点。 首先,GridControl是一种...

Global site tag (gtag.js) - Google Analytics