本文翻译自:How can I remove a style added with .css() function?

I'm changing CSS with jQuery and I wish to remove the styling I'm adding based on the input value: 我正在用jQuery更改CSS,我希望根据输入值删除我添加的样式:

if(color != '000000') $("body").css("background-color", color); else // remove style ?

How can I do this? 我怎样才能做到这一点? Note that the line above runs whenever a color is selected using a color picker (ie. when mouse moves over a color wheel). 请注意,只要使用颜色选择器选择颜色(即鼠标在色轮上移动时),就会运行上面的一行。

2nd note: I can't do this with css("background-color", "none") because it will remove the default styling from the css files. 第二个注意事项:我无法用css("background-color", "none")执行此操作,因为它将从css文件中删除默认样式。 I just want to remove the background-color inline style added by jQuery. 我只想删除jQuery添加的background-color内联样式。


#1楼

参考:https://stackoom.com/question/GwAb/如何删除添加了-css-函数的样式


#2楼

How about something like: 怎么样的:

var myCss = $(element).attr('css');
myCss = myCss.replace('background-color: '+$(element).css('background-color')+';', '');
if(myCss == '') {$(element).removeAttr('css');
} else {$(element).attr('css', myCss);
}

#3楼

There are several ways to remove a CSS property using jQuery: 有几种方法可以使用jQuery删除CSS属性:

1. Setting the CSS property to its default (initial) value 1.将CSS属性设置为其默认(初始)值

.css("background-color", "transparent")

See the initial value for the CSS property at MDN . 查看MDN上CSS属性的初始值 。 Here the default value is transparent . 这里的默认值是transparent You can also use inherit for several CSS properties to inherite the attribute from its parent. 您还可以对几个CSS属性使用inherit来从其父级继承该属性。 In CSS3/CSS4, you may also use initial , revert or unset but these keywords may have limited browser support. 在CSS3 / CSS4中,您也可以使用initialrevertunset但这些关键字可能具有有限的浏览器支持。

2. Removing the CSS property 2.删除CSS属性

An empty string removes the CSS property, ie 空字符串删除CSS属性,即

.css("background-color","")

But beware, as specified in jQuery .css() documentation , this removes the property but it has compatibilty issues with IE8 for certain CSS shorthand properties, including background . 但请注意,正如jQuery .css()文档中所指定的,这会删除该属性,但它与IE8的某些CSS速记属性(包括背景)存在兼容性问题。

Setting the value of a style property to an empty string — eg $('#mydiv').css('color', '') — removes that property from an element if it has already been directly applied, whether in the HTML style attribute, through jQuery's .css() method, or through direct DOM manipulation of the style property. 将style属性的值设置为空字符串 - 例如$('#mydiv')。css('color','') - 如果已经直接应用了元素,则从元素中删除该属性,无论是HTML样式属性,通过jQuery的.css()方法,或通过样式属性的直接DOM操作。 It does not, however, remove a style that has been applied with a CSS rule in a stylesheet or element. 但是,它不会删除样式表或元素中使用CSS规则应用的样式。 Warning: one notable exception is that, for IE 8 and below, removing a shorthand property such as border or background will remove that style entirely from the element, regardless of what is set in a stylesheet or element . 警告: 一个值得注意的例外是,对于IE 8及更低版本,删除边框或背景等速记属性将完全从元素中删除该样式,无论样式表或元素中设置了什么

3. Removing the whole style of the element 3.删除元素的整个样式

.removeAttr("style")

#4楼

If you use CSS style, you can use: 如果使用CSS样式,则可以使用:

$("#element").css("background-color","none");

and then replace with: 然后替换为:

$("#element").css("background-color", color);

If you don't use CSS style and you have attribute in HTML element, you can use: 如果您不使用CSS样式并且HTML元素中有属性,则可以使用:

$("#element").attr("style.background-color",color);

#5楼

Use my Plugin : 使用我的插件:

$.fn.removeCss=function(all){if(all===true){$(this).removeAttr('class');}return $(this).removeAttr('style')}

For your case ,Use it as following : 对于您的情况,请按以下方式使用它:

$(<mySelector>).removeCss();

or 要么

$(<mySelector>).removeCss(false);

if you want to remove also CSS defined in its classes : 如果你想删除其类中定义的CSS:

$(<mySelector>).removeCss(true);

#6楼

either of these jQuery functions should work: 这些jQuery函数中的任何一个都应该工作:

$("#element").removeAttr("style");
$("#element").removeAttr("background-color")

如何删除添加了.css()函数的样式?相关推荐

  1. JSP实现登录删除添加星座等(带样式)

    功能要求 1.完成两个页面 2.第一个登陆页面login. jsp 3.第二个用户管理页面useManage. jsp 4.有登录功能(能进行用户名密码的校验,用户名若为自己的学号密码为班级号,允许登 ...

  2. php动态添加div,jq如何动态添加动态css样式

    jq动态添加动态css样式的方法:首先准备jquery库文件,并声明一个class样式:然后准备一个事件加载初始化的方法,并直接用匿名函数:接着addClass方法给div元素添加class:最后通过 ...

  3. 【Linux 内核 内存管理】RCU 机制 ③ ( RCU 模式下添加链表项 list_add_rcu 函数 | RCU 模式下删除链表项 list_del_rcu 函数 )

    文章目录 一.RCU 模式下添加链表项 list_add_rcu 函数 二.RCU 模式下删除链表项 list_del_rcu 函数 一.RCU 模式下添加链表项 list_add_rcu 函数 在 ...

  4. CSS文件添加 @charset utf-8; 可能会引起样式在IE6下失效

    今天在本地调试好页面在IE6,7,8,及火狐的效果后,上传服务器,上传以后,发现页面在IE7,8,火狐下是正常的,在IE6下串位. 问题发生以后,我在本地又测试了一下IE6的效果,一切正常,可是服务器 ...

  5. JS添加/修改CSS样式

    JS添加/修改CSS样式是通过.style.xxxx属性=值来实现的,记得是等号赋值. document.getElementById("xx").style.xxx=xxxxx; ...

  6. php表格所有边框实线,css表格怎么添加边框样式?css表格边框样式总结(附完整实例)...

    本篇文章主要讲述的就是关于css表格添加边框样式,这里还有关于css表格边框样式的总结,还有css表格边框的完整实例.接下来就让我们一起来看这篇文章吧 首先我们先看看如何利用css来给表格添加边框: ...

  7. jq删除某个css样式,jq删除属性_使用jquery删除css属性或样式

    摘要 腾兴网为您分享:使用jquery删除css属性或样式,中国体育,有信,相机美颜,腾讯小说等软件知识,以及来电,会动的手机壁纸,网销客,酷6,我不是我没有表情包,乐校通,搜达足球网,led滚动显示 ...

  8. html怎么给变量添加样式,通过CSS变量修改样式

    js怎么去修改css伪类样式呢?但是js并没有伪类选择器,那么该怎么办呢?网上有不少方法,比如通过切换元素的类.在style中动态插入新的样式等. 那么这里再来一种方法,设置css变量(var),通过 ...

  9. CSS/CSS3常用样式与web移动端资源

    CSS/CSS3常用样式与知识点 IE条件注释 条件注释简介 IE中的条件注释(Conditional comments)对IE的版本和IE非IE有优秀的区分能力,是WEB设计中常用的hack方法. ...

最新文章

  1. 创建第一个freemarker
  2. python中怎么比较两个列表-Python3列表(list)比较操作教程
  3. 【错误记录】NDK 配置错误 ( C/C++ debug|arm64-v8a : Could not get version from cmake.dir path )
  4. Java并发编程:Lock和Synchronized 转
  5. TensorFlow 2.0 快速上手教程与手写数字识别例子讲解
  6. python tkinter计算器实例_python -Tkinter 实现一个小计算器功能
  7. [华为机试练习题]37.合唱队
  8. Thread.SetData与ThreadStatic
  9. sql 保留整数_Spark 3.0发布啦,改进SQL,弃Python 2,更好的兼容ANSI SQL,性能大幅提升...
  10. [问题记录]编译AArch64平台的sigar源码遇到的问题
  11. Makefile编写实例
  12. fatal error: google/protobuf/stubs/stringprintf.h: No such file or directory
  13. python去除视频水印接口_使用ffmpeg去除视频水印【ffmpeg】
  14. Star Way To Heaven 二分 + 并查集 + Prime
  15. python微博相册爬虫
  16. 群辉 NAS 配置 iSCSI 存储
  17. 测试脉冲电磁对于铝片和铜片的影响
  18. 测试案例:如何测试一间教室?
  19. CAD教程:CAD软件中CAD布尔运算命令怎么用?
  20. 破解CMOS密码和隐藏文件

热门文章

  1. linux mono环境
  2. Source does not fit in dest
  3. 如何更好地理解和应用ITIL
  4. [笔记].Nios II 软核性能基准
  5. GdiPlus[16]: IGPLinearGradientBrush 之 SetBlendBellShape、SetBlendTriangularShape
  6. Basic Edit in vim
  7. JEECG传统版问题分析
  8. 瀑布流 jquery。
  9. Coarse-Grained lock 粗粒度锁
  10. suse linux rpm 安装