programing

jQuery에서 css 속성을 제거하는 방법

telebox 2023. 5. 17. 22:45
반응형

jQuery에서 css 속성을 제거하는 방법

if(prev_clicked)
{   
    $("#accordion li a.category").css('background-image', 'url("img/off_all_channel.png")');                    
    $("#accordion li a.comment").css('background-image', 'url("img/on_all_online.png")');                   
    $(".icha0").removeProperty("background-color");
    $(".icha0").removeProperty("opacity");
}
else
{   
   $(".icha0").css("background-color","#D5D5D2");
   $(".icha0").css("opacity","0.70");
}

제가 추가한 두 개의 css 속성을 제거하려고 하는데 작동하지 않는 것 같습니다.그래도?

다음 방법으로 제거할 수 있습니다.

$(".icha0").css({ 'background-color' : '', 'opacity' : '' });

를 사용하여 다음과 같이 CSS 속성을 제거할 수도 있습니다.

$(".icha0").css("background-color","");
$(".icha0").css("opacity","");

jquery 설명서에 언급된 대로:

스타일 속성 값을 빈 문자열로 설정(예: $('#mydiv').css('color', '') - 이미 직접 적용된 경우 해당 속성을 요소에서 제거합니다.

인라인 CSS 속성을 제거하려면 다음을 사용합니다.

$('.className').css({propertyName: ''});

요소의 전체 인라인 스타일을 제거하려면 다음을 사용합니다.

$('.className').removeAttr('style');

스타일(별도의 파일)에서 CSS 속성을 제거하는 제안도 찾았습니다.

$(.className').style.propertyName = '';

하지만 전혀 작동하지 않아서 참고로 여기에 두겠습니다.

속성을 다시 공백으로 설정할 수 있습니다.

$(".icha0").css("background-color","");

또는 CSS 파일에 정의된 클래스를 사용하도록 코드를 변경할 수 있습니다.

$(".icha0").addClass('properties'); 
$(".icha0").removeClass('properties');

저는 이 문제를 겪고 있었지만 OP를 만족시키는 해결책을 본 적이 없습니다.대부분의 솔루션은 가치가 없는 전체 스타일 속성을 제거할 것을 제안합니다.

저는 jQuery의 소품 방법을 사용했습니다.

var styleObject = $('my-selector').prop('style'); 

styleObject.removeProperty('background-color');

농담조로

  $('#ID').removeAttr("style")

우스갯소리로

document.getElementById("ID").removeAttribute("style")

DOM 요소에 적용된 CSS 스타일 클래스를 직접 제거하거나 요소에서 적용된 CSS 스타일을 제거하는 두 가지 방법이 있습니다.

//Remove the class associated with element

$('#ID').removeClass("cssClass");

//Remove the CSS style from DOM element

$('p').css({"color":""});

이것은 말 그대로 이 답변에서 복사 붙여넣기이며, 이전에 실행된 함수에서 jQuery로 추가한 CSS 스타일을 지우기 위해 사용합니다.

인라인 CSS 속성을 제거하려면 다음을 사용합니다.

$('.className').css({propertyName: ''});   

요소의 전체 인라인 스타일을 제거하려면 다음을 사용합니다.

$('.className').removeAttr('style');

또는 ID:

$('#idName').removeAttr('style');

일부 문제를 해결할 수 있는 대체 옵션입니다.

요소에 새 클래스를 추가하고 속성에 inherit!important 값을 지정합니다. 예:

CSS

.clearCSS {
    background-color: inherit !important;
}

농담의

$(".icha0").addClass('clearCSS'); 

JQuery에서 모든 CSS 속성을 제거하기 위해 다음 코드를 사용할 수 있습니다.

    $(".selector").removeClass().removeAttr('style');

감사해요.

<script>
        require(['jquery', 'domReady!'], function($) {
            if ($('#p_method_use_reward_points').prop('checked')) {
                $('.test').show();
                console.log('working');
            }else{
                $('.test').hide();
                console.log('not working');
            }
            $('#submit_reward').on('click', function (e){
                let getPoints = $('#custom_reward_set').val();
                let checkField = $('#custom_reward_set').prop("readonly");
                // alert(getPoints);
                if (!getPoints){
                    alert('PLease add reward points');
                }
                if (getPoints) {
                    $("#custom_reward_set").prop("readonly", !$("#custom_reward_set").attr('readonly'));
                    if ($('#custom_reward_set').is('[readonly]')) {
                        $("#custom_reward_set").css({
                            "background-color": "#EBEBE4",
                            "border": "1px solid #ABADB3", "cursor": "not-allowed"
                        });
                    }else{
                        $('#custom_reward_set').removeAttr('style');
                    }
                }
               e.preventDefault();

            })
        });
    </script>

특정 속성을 업데이트하지 않고 제거해야 하는 경우 속성을 제거하지 않고 removeProp을 사용하면 됩니다.

$(".icha0").removeProp("background-color");
$(".icha0").removeProp("opacity");

언급URL : https://stackoverflow.com/questions/9405689/how-to-remove-css-property-in-jquery

반응형