Estou mudando CSS com jQuery e desejo remover o estilo que estou adicionando com base no valor de entrada:
if(color != '000000') $("body").css("background-color", color); else // remove style ?
Como posso fazer isso?
Observe que a linha acima é executada sempre que uma cor é selecionada usando um seletor de cores (ou seja, quando o mouse se move sobre uma roda de cores).
2ª nota: não posso fazer isso css("background-color", "none")
porque removerá o estilo padrão dos arquivos CSS .
Eu só quero remover o background-color
estilo embutido adicionado pelo jQuery .
javascript
jquery
css
background
Alex
fonte
fonte
Respostas:
Alterar a propriedade para uma sequência vazia parece fazer o trabalho:
fonte
A resposta aceita funciona, mas deixa um
style
atributo vazio no DOM nos meus testes. Não é grande coisa, mas isso remove tudo:Isso pressupõe que você deseja remover todo o estilo dinâmico e retornar ao estilo da folha de estilo.
fonte
Existem várias maneiras de remover uma propriedade CSS usando o jQuery:
1. Configurando a propriedade CSS para seu valor padrão (inicial)
Veja o valor inicial da propriedade CSS em MDN . Aqui o valor padrão é
transparent
. Você também pode usarinherit
para várias propriedades CSS para herdar o atributo de seu pai. No CSS3 / CSS4, você também pode usarinitial
,revert
ouunset
essas palavras-chave podem ter suporte limitado ao navegador.2. Removendo a propriedade CSS
Uma string vazia remove a propriedade CSS, ou seja,
Mas tenha cuidado, conforme especificado na documentação do jQuery .css () , isso remove a propriedade, mas há problemas de compatibilidade com o IE8 para determinadas propriedades abreviadas de CSS, incluindo plano de fundo .
3. Removendo todo o estilo do elemento
fonte
Peguei o caminho para remover um atributo de estilo com JavaScript puro, apenas para que você saiba o caminho do JavaScript puro
fonte
Isso removerá a tag completa:
fonte
qualquer uma dessas funções jQuery deve funcionar:
fonte
var cssObject = $('selector').prop('style'); cssObject.removeProperty('background-color');
Apenas usando:
ou
fonte
Que tal algo como:
fonte
Use meu plug-in:
Para o seu caso, use-o da seguinte forma:
ou
se você deseja remover também o CSS definido em suas classes:
fonte
$(this).removeAttr
é redundante ethis.removeAttr
deve ser suficiente.removeAttr
irá remover tambémclass
attr? acho que não #removeAttr
interior do seu plugin, ondethis
já é um elemento jQuery.$(this)
é redundante.this
comoHTMLElement
instância mapeada para o elemento jQuery ... Como você vê, minha resposta é antiga ... é por isso que ... de qualquer maneira, eu posso te dizer por que eles mudam isso, eles fazem isso por causa da função de seta que é nova no ES6. .. ethis
se torna inútil e foi substituído porevent.currentTarget
Tente o seguinte:
obrigado
fonte
Se você usa o estilo CSS, pode usar:
e substitua por:
Se você não usar o estilo CSS e tiver um atributo no elemento HTML, poderá usar:
fonte
2018
existe uma API nativa para isso
fonte
Este também funciona !!
fonte
Por que não criar o estilo que você deseja remover uma classe CSS? Agora você pode usar:
.removeClass()
. Isso também abre a possibilidade de usar:.toggleClass()
(remova a classe, se estiver presente, e adicione-a, se não estiver.)
Adicionar / remover uma classe também é menos confuso para alterar / solucionar problemas ao lidar com problemas de layout (em vez de tentar descobrir por que um estilo específico desapareceu.)
fonte
fonte
Isso é mais complexo do que algumas outras soluções, mas pode oferecer mais flexibilidade nos cenários:
1) Faça uma definição de classe para isolar (encapsular) o estilo que você deseja aplicar / remover seletivamente. Pode estar vazio (e, neste caso, provavelmente deveria estar):
2) usar esse código, baseado em http://jsfiddle.net/kdp5V/167/ de esta resposta por gilly3 :
Exemplo de uso: http://jsfiddle.net/qvkwhtow/
Ressalvas:
Isolar o estilo dessa maneira é a essência do CSS, mesmo que manipulá-lo. Manipular regras CSS NÃO é do que se trata o jQuery, o jQuery manipula elementos DOM e usa seletores CSS para fazer isso.
fonte
Simples é barato no desenvolvimento web. Eu recomendo usar uma string vazia ao remover um estilo específico
fonte
Tente isto
fonte