[jquery] jquery 변경 클래스 이름

td 태그의 ID가 주어지면 td 태그의 클래스를 변경하고 싶습니다.

<td id="td_id" class="change_me"> ...

다른 dom 객체의 click 이벤트 내부 에서이 작업을 수행 할 수 있기를 원합니다. td의 ID를 가져 와서 클래스를 변경하려면 어떻게합니까?



답변

당신은 할 수 설정 (관계없이 어떤 클래스 였다을 사용하여) .attr()과 같이 :

$("#td_id").attr('class', 'newClass');

클래스 를 추가 하려면 .addclass()다음과 같이 대신 사용 하십시오.

$("#td_id").addClass('newClass');

또는 다음을 사용하여 클래스를 바꾸는 짧은 방법 .toggleClass():

$("#td_id").toggleClass('change_me newClass');

다음은 class속성에 대한 jQuery 메소드의 전체 목록입니다 .


답변

나는 당신이 이것을 찾고 있다고 생각합니다 :

$('#td_id').removeClass('change_me').addClass('new_class');


답변

클래스 이름을 바꾸고 싶다고 생각합니다.

이와 같은 것이 효과가 있습니다.

$(document).ready(function(){
    $('.blue').removeClass('blue').addClass('green');
});

에서 http://monstertut.com/2012/06/use-jquery-to-change-css-class/


답변

당신은 이것을 할 수 있습니다 :
$("#td_id").removeClass('Old_class');
$("#td_id").addClass('New_class');

또는 당신은 이것을 할 수 있습니다

$("#td_id").removeClass('Old_class').addClass('New_class');


답변

addClass 또는 toggleClass를 확인할 수 있습니다


답변

클릭하면 변경됩니다. 전체 프로세스를 진행하겠습니다. “외부 DOM 객체”가 select와 같은 입력이라고 가정합니다.

이 HTML부터 시작하겠습니다 :

<body>
  <div>
    <select id="test">
      <option>Bob</option>
      <option>Sam</option>
      <option>Sue</option>
      <option>Jen</option>
    </select>
  </div>

  <table id="theTable">
    <tr><td id="cellToChange">Bob</td><td>Sam</td></tr>
    <tr><td>Sue</td><td>Jen</td></tr>
  </table>
</body>

매우 기본적인 CSS :

​#theTable td {
    border:1px solid #555;
}
.activeCell {
    background-color:#F00;
}

그리고 jQuery 이벤트를 설정하십시오.

function highlightCell(useVal){
  $("#theTable td").removeClass("activeCell")
      .filter(":contains('"+useVal+"')").addClass("activeCell");
}

$(document).ready(function(){
    $("#test").change(function(e){highlightCell($(this).val())});
});

이제 선택에서 무언가를 선택할 때마다 일치하는 텍스트가있는 셀을 자동으로 찾아 전체 ID 기반 프로세스를 파괴 할 수 있습니다. 물론 그렇게하고 싶다면 값을 사용하지 않고 ID를 사용하도록 스크립트를 쉽게 수정할 수 있습니다.

.filter("#"+useVal)

ID를 적절하게 추가하십시오. 도움이 되었기를 바랍니다!


답변

편집하다:

중첩 요소 에서 변경한다고 말하면 ID가 전혀 필요하지 않습니다. 대신이 작업을 수행 할 수 있습니다.

$(this).closest('td').toggleClass('change_me some_other_class');
    //or
$(this).parents('td:first').toggleClass('change_me some_other_class');

원래 답변 :

$('#td_id').removeClass('change_me').addClass('some_other_class');

다른 옵션은 다음과 같습니다.

$('#td_id').toggleClass('change_me some_other_class');