source

jQuery를 사용하여 하나의 스타일 속성만 제거하는 방법은 무엇입니까?

bestscript 2023. 8. 8. 23:24

jQuery를 사용하여 하나의 스타일 속성만 제거하는 방법은 무엇입니까?

나는 이 재산을 가진 디브를 가지고 있습니다.style="-moz-user-select:none; position:static !important;"저는 그것을 제거해야 합니다.-moz-user-select시도됨$(selector).css()하지만 어떤 값을 설정해야 할지 모르겠어요. 왜냐하면 그것은."none".

css()대한 설명서에 따르면 스타일 속성을 빈 문자열로 설정하면 스타일 시트에 없는 경우 해당 속성이 제거됩니다.

스타일 속성 값을 빈 문자열로 설정(예:$('#mydiv').css('color', '')HTML 스타일 속성에서 jQuery를 통해 해당 속성이 이미 직접 적용된 경우 해당 속성을 요소에서 제거합니다..css()메서드 또는 스타일 속성의 직접 DOM 조작을 통해.그러나 스타일시트에서 CSS 규칙이 적용된 스타일을 제거하지는 않습니다.<style>원소의

스타일이 인라인이므로 다음과 같이 쓸 수 있습니다.

$(selector).css("-moz-user-select", "");

저는 이 질문이 jQuery에 관한 것이라는 것을 알고 있지만 (Google에서 비틀거리는 저와 같은 사람들을 위해) 바닐라 js로 해결책을 추가하고 싶습니다.

( GIST 기준)

아래는 메소드의 내역이지만 댓글을 제거하고 꽤 작고 간단한 원라이너 분할->필터->가입

const removeStyleProp = (elm, prop) => 
  elm.style.cssText = elm.style.cssText // "top: 0px; bottom: 50px; text-align: right;"
    .split('; ') // ["top: 0px", "bottom: 50px", "right: 2px", "text-align: right;"]
    .filter(p => !p.startsWith(prop) ) // ["top: 0px", "bottom: 50px", "text-align: right;"]
    .join(';');

// usage:
removeStyleProp(test, 'right')
console.log( test.style.cssText )
<div id='test' style='top:0;right:5px;bottom:50px;right:2px;text-align:right;'></div>

또는 Regex를 사용하여 수행할 수도 있습니다.

"-moz-user-select:none"을 "-moz-user-select:inherit"로 바꿀 수도 있습니다.이렇게 하면 모든 상위 스타일에서 스타일 값을 상속하거나 상위 스타일이 정의되지 않은 경우 기본 스타일에서 스타일 값을 상속합니다.

언급URL : https://stackoverflow.com/questions/5951365/how-to-remove-only-one-style-property-with-jquery