在 JavaScript 或 jQuery 中动态更改 CSS 规则

2024-04-13

我正在寻找一种方法来更改文档中导入的样式表的 CSS 规则。所以我有一个外部样式表和一些class and div里面的属性。我想使用 JavaScript 或 jQuery 更改其中一项规则。

这是一个例子:

.red{
    color:red;
}

所以我们的想法是用 JavaScript 做一些事情,而 HTML 知道现在color另一种颜色是这样的:

.red{
    color:purple;
}

但我希望对将来通过附加方式添加的每个元素都有这个规则。所以如果我添加一个span与 CSS 类.red,文本必须是紫色而不是红色。

我希望我说清楚了。


您可以将样式声明注入到 DOM 中。

$("head").append('<style>.red { color: purple }</style>');
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

在 JavaScript 或 jQuery 中动态更改 CSS 规则 的相关文章

  • Chrome JavaScript 日期构造函数获取 1884 年之前的日期似乎是错误的

    如果我将 1 1 1753 午夜 的 unix 毫秒时间戳值 6847786800000 传递给 Chrome 中的 JavaScript Date 构造函数 则 Chrome 给出的日期看起来非常奇怪 当我使用带有七个参数的 Date 构
  • 如何避免 TypeScript 中出现虚假的“未使用参数”警告

    我遇到过很多次这种情况 最后决定弄清楚正确的方法是什么 如果我有一个声明方法的抽象父类 然后一些具体子类在其实现中实现真正的逻辑 并且显然使用方法参数 但某些子类不需要在该方法中执行任何操作 因此不要使用方法参数 那些不必执行任何操作的方法
  • 在 JQuery ui 自动完成中显示图像

    我有一个带有 JQuery ui 自动完成功能的脚本 可以完美运行 有一个显示用户名字和姓氏的搜索过程 但在我的数据库中 还有用户的图片 我想将其显示在带有名字和姓氏的建议中 数据库中pic包含图片url 剧本 function searc
  • 动态更改 vuejs 2 中的选择输入选项

    如何动态更改选择下拉 v model 中的选项 我有 2 个选择输入 其中一个应该根据其他输入进行更改 例如 如果我选择 水果 则选择显示水果 如果我选择 蔬菜 则选择显示蔬菜 我不使用Vuejs 但查看文档后 var TypesArr F
  • @font-face 字体在 Mac 的 Safari 和 Chrome 中显示模糊

    I m using two special fonts on my website for headings and subtitles They are working fine on a PC in IE Firefox and Chr
  • iOS 键盘显示后分屏宽度

    我刚刚开始研究 Cordova 应用程序对分屏多任务处理的支持 到目前为止 该应用程序在模拟器中的 iPad 上显示和调整大小都很好 但是当我单击编辑字段并显示软件键盘时 100 宽度的值开始返回整个屏幕 而不是给出的窗口 初始显示 到目前
  • Angularjs - 将 True/False 显示为 Yes/No

    有没有一种简单的方法可以将真 假值显示为是 否 我正在从数据库检索包含以下内容的 JSON 对象 对象 WithCertification true 这是 HTML 有认证 elem WithCertification 正在显示这个 认证真
  • 如何使用CSS将文本放在“框”的右上角或右下角

    我怎样才能得到here and and here位于右侧 与 lorem ipsums 位于同一行 请参阅以下内容 Lorem Ipsum etc here blah blah blah blah lorem ipsums and here
  • 如何使用 jest 通过 Promise.all 设置多次提取测试

    我在测试中使用 jest 我正在使用 React 和 Redux 并且执行以下操作 function getData id notify return dispatch gt dispatch anotherFunction Promise
  • Onblur 事件在另一个 div 的 onclick 之前触发

    如上所述 我有一个按钮 单击该按钮将打开子菜单 对于子菜单中的每个选项 都有三个元素 我认为实际上还有更多元素 但为了简单起见 将其保留为 3 我将焦点放在子菜单的主 div 白色 框架 上 Onblur 这个 div 然后我隐藏子菜单 这
  • iPhone 点击时使 div 变暗

    当您的 div 附加了点击处理程序时 当点击该 div 时 iPhone 会使该 div 变暗 作为点击指示器 示例 在移动 Safari 上查看http jsbin com awejo3 4 http jsbin com awejo3 4
  • jquery ajax加载后丢失CSS

    大家知道如何解决 load Ajax 请求后的 css 问题吗 例如 如果我想从网页加载 DIV 在我的 Ajax 请求之后 container load path to div div id 我丢失了与该 div 关联的所有 css 和脚
  • CSS:理解和调整字体的行距/行高

    有人问了一个非常相似的问题here https stackoverflow com questions 13701110 css remove line height leading on larger text但确实回答得足够了 CSS
  • 什么是 TinyMCE jQuery 包?

    我被要求在项目中使用 TinyMCE 编辑器 在下载页面上 有一个主包 然后是一个 jQuery 包 This package contains special jQuery build of TinyMCE and a jQuery in
  • 有没有办法从画布上清除一个元素而不消除其他元素?

    我正在使用画布构建页面加载器 并使用 es6 类 虽然目前我无法使其正常工作 原因之一是我找不到清除画布的方法进展 到目前为止 这是我的代码 class Loader constructor width height this width
  • 带缩略图的轮播和 bootstrap v4

    我看到了带有缩略图的轮播演示bootstrap 3 here http jsfiddle net talmand JS6JV 我正在尝试为 bootstrap v4 实现相同的功能 但无法弄清楚如何修复一些 UI 细节 例如左 右阴影覆盖整
  • 如何在 Firefox 插件中追加到文件?

    var tabs require sdk tabs var iofile require sdk io file var widgets require sdk widget var selection require sdk select
  • 错误:模块“html”不提供视图引擎(Express)

    我正在尝试设置一个简单的路由应用程序 但在渲染页面时不断遇到错误 Error Module html does not provide a view engine 奇怪的是我已经在 app js 文件中指定了视图引擎 但仍然收到错误 app
  • Javascript/jQuery 外部高度()

    Does idOfLememt outerHeight 对所有浏览器产生相同的结果 IE7 有什么不同吗 只要去http api jquery com outerHeight http api jquery com outerHeight
  • Angular 2:使用正则表达式进行数字验证

    我正在尝试验证 IE 11 中的数字字段

随机推荐

  • Django 多个数据库 - 一个并不总是可用

    我正在开发一个 Django 应用程序 它将使用多个数据库后端 我想在运行 django 应用程序的机器上放置一个 sqlite 数据库 并同步到远程 mysql 数据库 棘手的部分是 运行应用程序的机器并不总是有互联网连接 因此 mysq
  • 根据用户选择的选项设置单选按钮的值

    根据用户对三个下拉列表的选择 我想从下面的对象中设置给定单选按钮的值 例如 如果我从第一个选择标签中选择 Drop Down 1 1 并将其他两个留空 则 radio button 4 的值不会为 r 5000 R 如果我选择 下拉 1 1
  • 使用嵌套字典Python的自定义类

    当使用相同的键在嵌套字典中添加值时遇到问题 并且该值始终显示相同的值 事实是 我想更新值事件 键是相同的 该算法是人工鱼群算法的基础 example gt gt fish template 0 weight 3 1 visual 2 ste
  • Boost read_json 和 C++11

    我正在尝试使用 Boost 的 property tree 解析器和 C 11 代码解析 JSON 我的系统是带有 gcc 4 7 2 和 Boost 1 49 的 Debian Wheezy 我尝试了以下代码基于使用 boost 序列化和
  • 数组映射返回未定义的数组,何时应返回对象数组

    为什么 a b c map x gt letter x 返回一个未定义的数组 and a b c map x gt letter x 0 正确返回对象数组 Because 您可以使用大括号作为块语句 https developer mozi
  • 在数据框中创建一个新列:组中的索引(组之间不唯一)

    我有一个包含两列的数据框 第一列包含每个人所属的组 第二列包含个人的 ID 见下文 df lt data frame group c G1 G1 G1 G1 G2 G2 G2 G2 indiv c indiv1 indiv1 indiv2
  • android 如何监听自定义变量?

    我看过这个线程 如何实现监听器 https stackoverflow com questions 5941960 android how to implement listener关于实现侦听器 它实际上非常简单 但我不知道它到底是如何完
  • 检索并使用 Microsoft 或 Mozilla 的 Root-CA 列表并在 Java 中使用它?

    OpenJDK for Windows 中包含的根 CA 证书列表非常令人印象深刻 但有很多根 CA 证书受到 Firefox 等常见浏览器的信任 但不受 Java 信任 Both 微软 https support microsoft co
  • ASP.NET MVC3 和服务器端验证

    假设用户禁用了 javascript 因此客户端验证在 MVC3 中不起作用 实现服务器端验证的最佳方法是什么 以便当用户尝试以不适当的方式处理数据时仍然显示验证消息 Thanks EDIT 显然发生这种情况是因为我使用 EF 生成的模型
  • jquery fancybox 触发点击仅工作一次

    我从绑定到表行的单击事件调用 jquery fancybox 链接 该操作第一次工作正常 但是 如果我关闭 fancybox 并再次单击任何行 绑定到该行的匿名函数仍然会触发 但 fancybox 不会启动 这是我正在使用的 JavaScr
  • 在 CruiseControl.NET 构建中使用“devenv”和“msbuild”有什么区别?

    CruiseControl NET 中使用 标记和 标记的主要区别是什么 我知道它们调用不同的可执行文件 但有时我会得到不同的结果 就编译时的通过 失败而言 我想知道为什么两个构建命令之间存在差异 基本上 devenv Visual Stu
  • hashbang 行上的 Eclipse javascript 语法错误

    当我将一些现有的 Node js 代码导入 Eclipse 工作区时 它会抱怨 令牌 无效字符 出现语法错误 请删除此令牌 on the usr bin env node哈希邦线 我怎样才能告诉 Eclipse 忽略这个错误 对于 Node
  • Android - 如何更新通知号码

    您好 我想在单个视图中显示所有通知 并且想要更新状态栏中的通知数量 它更新所有信息 但显示数量始终为 1 请告诉我如何解决它 Override public void onReceive Context context Intent int
  • VHDL 中的 #define 等价物是什么

    VHDL 中的 define ifdef 和 ifndef 相当于什么 我想使用泛型作为 define 并根据它们更改设计 举一个简单的例子 定义一个字符串泛型并用它来确定时钟是单时钟还是差分时钟 generic something boo
  • 如何将 NSData 转换为 NSString? [复制]

    这个问题在这里已经有答案了 可能的重复 将 UTF 8 编码的 NSData 转换为 NSString https stackoverflow com questions 2467844 convert utf 8 encoded nsda
  • 如何在其适配器的 onBindViewHolder 内更新 recyclerView?

    我在 recyclerView 中制作了一张卡片列表 当卡持有一段时间后 其在数据库中的相应条目将被删除 因此之后 必须删除该卡 这可以通过调用设置新的更新适配器来完成 但我无法在 onBindViewHolder 中使用 setAdapt
  • 在 Firefox 中,在选项卡重定向之前获取 URL 的方法是什么?

    我为 Firefox 开发了一个附加组件 它有一个重定向链接 https www google com vn url sa t rct j q esrc s source web cd 1 cad rja uact 8 ved 0CB0QF
  • pytest 无法导入模块,而 python 可以

    我正在用 Python 开发一个包 我使用虚拟环境 我在 virtualenv 的 pth 路径中设置了模块根目录的路径 这样我就可以在开发代码时导入包的模块并进行测试 问题 1 这是一个好方法吗 这工作正常 这是一个例子 这是我想要的行为
  • 使用证书和自定义 ssl 套接字工厂到 ldap 的 SSL 连接

    这是我的场景 我想使用 jndi 连接到 ldap 我使用自定义 SSLSOcketfactory 来读取信任库和密钥库 上下文创建成功 但是当我尝试使用相同的凭据进行身份验证时 它会抛出一个错误 告知不支持该身份验证方法 这是我的自定义
  • 在 JavaScript 或 jQuery 中动态更改 CSS 规则

    我正在寻找一种方法来更改文档中导入的样式表的 CSS 规则 所以我有一个外部样式表和一些class and div里面的属性 我想使用 JavaScript 或 jQuery 更改其中一项规则 这是一个例子 red color red 所以