“Como alterar o estilo CSS no clique” Respostas de código

Como alterar o estilo CSS no clique

const elem = document.getElementById('elem-id');
// Now that we got the element we needed,
// there are 3 ways that we can style it when it's clicked

// method 1: .onclick
elem.onclick = () => {
  elem.style.backgroundColor = 'red';
}

// method 2: .addEventListener
elem.addEventListener('click', function(){
  elem.style.backgroundColor = 'red'; 
})

// method 3: function
function funcName(){
  elem.style.backgroundColor = 'red';
}
// now that we declared the function we need to call it on click,
// we can use both method 1 & 2, replace the code and call the function there
// or we can call it on the html attribute 'onclick'

// <div id="elem-id" onclick="funcName"></div>
ST111

JS OnClick Change CSS

<div id="foo">hello world!</div>
<img src="zoom.png" id="image" />
<script>
  $('#image').click(function() {
    $('#foo').css({
        'background-color': 'red',
        'color': 'white',
        'font-size': '44px'
    });
});
  </script>
Undefined

Como manter o estilo após clique

#activate-div{display:none}    

.my-div{background-color:#FFF} 

#activate-div:checked ~ label 
.my-div{background-color:#000}
Better Butterfly

Respostas semelhantes a “Como alterar o estilo CSS no clique”

Perguntas semelhantes a “Como alterar o estilo CSS no clique”

Mais respostas relacionadas para “Como alterar o estilo CSS no clique” em JavaScript

Procure respostas de código populares por idioma

Procurar outros idiomas de código