jquery에서 변수에 스타일을 지정하려면 어떻게해야합니까?

Question

클릭 할 때마다 버튼의 색상을 변경하려고합니다. 내 코드에서 linkNumber 값을 얻을 것이다. 나는 색깔을주고 싶다. 내가 한 방식이 효과가 없다. 필자는 경고를 통해 값을 확인하고 작동하는지 테스트했습니다.

var linkNumber = $(this).text(); 
       $(linkNumber).css("color", "yellow"); 
       alert(linkNumber); 

Answer 1

텍스트 자체에 색을 설정하려고 시도한 것 같습니다. 텍스트에는 색상이있을 수 없습니다. 컨테이너 (태그)에 CSS가있을 수 있습니다. 그래서 컨테이너에 CSS 색상을 설정하십시오.

$(this).css('color', 'yellow'); 

Answer 2

여기에 색상을 변경하는 몇 가지 버튼의 라이브 예제 : 첫 번째 클릭에

var colors = ["yellow", "red", "blue"]; 
 

 
$(document).ready(function() { 
 
    $("button").click(function() { 
 
    var currentIndex = Number($(this).data("ci")) || 0; 
 
    var nextIndex = (currentIndex + 1) % colors.length; 
 
    $(this).data("ci", nextIndex).css("color", colors[nextIndex]); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button>Button 1</button> 
 
<button>Button 2</button> 
 
<button>Button 3</button>

을, 버튼이 현재 colors[0]을 가정한다. 배열 인덱스가 증가하고 버튼에 저장되면 색상이 할당됩니다.

Answer 3

이 예제에서는 버튼을 클릭 할 때 사용할 버튼의 텍스트 색상을 변경하려는 경우 버튼의 배경색이 변경됩니다 색상 : 녹청;는 배경 컬러의 insted : 시안 재산

CSS

.clickme{ 
background-color:cyan; 
color:White; 
} 

HTML

<button class="clickme">button1</button> 
<button class="clickme">button2</button> 
<button class="clickme">button3</button> 

클릭 요소 jQuery를 기능

$(".clickme").click(function(){ 
$(this).css("background-color","green"); 
}); 

Here is the Working fiddle

Answer 4

당신은 또한 내가 요즘 jQuery를 사용에 대해 조언을 할 this.style.color = 'yellow';

에 직접 스타일을 추가 할 수 있습니다.

Array.from(document.querySelectorAll('button')) 
 
    .forEach(button => (button.addEventListener('click', (e) => { 
 
    e.target.style.color = 'red'; 
 
    })));

<button>button1</button> 
 
<button>button2</button>