修改!important定义的样式(2)

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 6     <meta http-equiv="X-UA-Compatible" content="ie=edge">
 7     <title>Document</title>
 8     <style>
 9         .test {
10             background: red !important;
11         }
12     </style>
13 </head>
14 <body>
15     <div class="test" style="background: yellow !important;">
16         <div class="container">
17             我是一个测试
18         </div>
19     </div>
20
21
22
23
24     <script src="./jquery-3.2.1.min.js"></script>
25     <script>
26         var sts = $(".test").attr("style") + ‘background:blue !important;‘;
27         $(".test").css("cssText", sts);
28         console.log($(".test"));
29     </script>
30 </body>
31 </html>
32   

最终的背景色为蓝色,需要的朋友可以直接复制代码查看效果

时间: 2024-12-18 13:08:09

修改!important定义的样式(2)的相关文章

用js修改带!important的css样式

普通jQuery修改css的方法或者用dom.style.width="100px"的原生方法修改具有!important表示的样式都无效.查看了w3c标准之后,发现另外一个原生方法可以在修改的时候指定优先级,并且使用之后可行.代码如下: dom.style.setProperty("width","100px","important"); dom.style是一个CSSStyleDeclaration对象,w3c中对它的解释

通过JS动态的修改HTML元素的样式和增添标签元素等

一. 通过JS动态的修改HTML元素的样式 1. 要想在js中动态的修改HTML元素的样式,首先需要写document, document我们称之为文档对象,这个对象中保存了当前网页中所有的HTML标签 代码写法如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>51-自定义原型对象</title>

!important定义为最高级不可替代

1 <!DOCTYPE html> 2 /*!important定义为最高级不可替代*/ 3 <html lang="en"> 4 <head> 5 <meta charset="UTF-8"> 6 <title>Title</title> 7 <style> 8 .c1{ 9 font-size: 32px; 10 background-color: red; 11 color:

定义文字样式-插件

今天抽时间写一个定义文字样式的插件: <!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>word</title></head><body><div class="word"> <

iPhone 上怎么给CSS定义 active 样式

如果给按钮定义 :hover 样式,在 iPhone 上按钮点击一次是 hover 态,再点击一次 hover 态才会消失,这不是我们想要的,继而想通过定义 :active 样式来实现按钮按下时的效果,但定义的 active 样式在 iPhone 上点击时没有任何效果 只需添加一段 js 即可: document.addEventListener("touchstart", function() {},false); 另一个方案,可以在 body 上添加 ontouchstart=&q

HTML中使用CSS -- 定义CSS样式

CSS:Cascading Style Sheets(层叠样式表) 有三种方式可以在XHTML页面中嵌入CSS.参见CSS教程. 1.在head标签中加载一个CSS文件 示例 <head> <link rel="stylesheet" type="text/css" href="style.css" /> </head> 此例使用了link标签. abbr { font-size:12px; } .text10

cursor -- 定义鼠标样式

cursor -- 定义鼠标样式 取值: [ [<uri> ,]* [ auto | crosshair | default | pointer | move | e-resize | ne-resize | nw-resize | n-resize | se-resize | sw-resize | s-resize | w-resize | text | wait | help | progress ] ] | inherit [<uri> ,]*: 根据用户定义的资源显示 a

【百度地图API1.1】修改文本标注的样式

原文:[百度地图API1.1]修改文本标注的样式 百度地图API1.0中文本标注的样式写法为: label.getDom().style.borderColor = "#808080"; label.getDom().style.color = "#333"; label.getDom().style.cursor = "pointer"; 2010年12月,百度地图API升级至1.1版本,文本标注的样式写法需要修改为:(否则将会导致鼠标点击失灵

【android自定义控件】LinearLayout定义ActionBar样式

其实大家看到都ActionBar说白了,就是自定义的一个Linearlayout或者RelatedLayout:今天就练练LinearLayout 自定义. LinearLayout自定义方法有多种: 1.自定义xml布局,然后加载布局,自定义一个View继承LinearLayout 2.在自定义控件中声明它的所有子元素,然后在Layout文件中像使用LinearLayout一样去进行布局, 第二种比较烦 ,它需要在Layout文件中定义好子元素之后,要在代码 onFinishInflate()