jQuery로 CSS "top"및 "left"속성 제거

지도를 드래그 할 때 요소에 각각의 값이있는 'left'및 'top'속성이 부여되는 드래그 가능한 맵을 작성합니다.

<div class="map" style="top:200px; left:100px;">Map</div>

클릭하면 div의 인라인 스타일에서 상단 및 왼쪽 속성을 제거하려는 버튼이 있습니다. 이는 jquery로 가능합니까?

CSS top및 의 기본값 left은입니다 auto. 따라서이를 설정하는 것은 수행하려는 작업에 따라 동일 할 수 있습니다.

$('.map').css('top', 'auto').css('left', 'auto');

style속성 을 완전히 제거하는 옵션도 있습니다 .

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

그러나 다른 jQuery UI 구성 요소를 사용하는 경우 제거하지 않으려는 인라인 스타일이 필요할 수 있으므로주의해서 진행하십시오.

상단 및 왼쪽 속성을 구체적으로 제거하고 다른 속성을 남기려면 다음과 같이하십시오.

$('.map').css('top', '').css('left', '');

또는 더 짧은 것 :

$('.map').css({
    'top': '',
    'left': ''
});

다음 style을 수행 하여 속성 의 모든 내용을 제거 할 수 있습니다 .

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

다음 style을 수행하여 특정을 제거 할 수 있습니다 .

$('.map').css('top', '');
$('.map').css('left', '');

CSS 속성을 빈 문자열로 설정하면됩니다 (예 : 다음 코드 사용).

$('#mydiv').css('color', '');

CSS의 jQuery 설명서를 참조하십시오 .

1. 여기로 이동 : jQuery API
2. '제거'에 대한 Ctrl + F
3. 읽다:

스타일 속성 값을 빈 문자열로 설정하면 (예 : $ ( "#mydiv") .css ( "color", "")) HTML 스타일에 관계없이 해당 속성이 요소에 이미 적용된 경우 해당 속성을 제거합니다. 속성, jQuery의 .css () 메소드 또는 스타일 속성의 직접적인 DOM 조작을 통해.

이 문서는 달성하려는 목표에 대한 현재 권장되는 접근 방식을 제공합니다. 스택 오버플로에서 화염 전쟁을 앞뒤로 읽을 필요가 없기 때문에 시간을 절약 할 수 있습니다. !).

당 이 JQuery와 버그 리포트

element.removeAttr ( 'style')

element.attr ( 'style', '')

모든 것을 제거하려면 할 수 있습니다

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

$.fn.removeCss=function(prop){
   if(!prop){
          return $(this).removeAttr('style').removeAttr('class');
     }
    else{
         return $(this).css(prop,null);
    }

}

그런 다음 CSS 소품을 제거하려면 :

    $('#mydiv').removeCss('color');
//To remove all prop Css
    $('#mydiv').removeCss();

내 생각에 가장 깨끗한 방법은 속성 을 null / zero / default 값으로 덮어 쓰지 않고 요소의 CSSStyleDeclaration 에서 속성을 완전히 제거하는 것입니다.

$(".foo").prop("style").removeProperty("top");
$(".foo").prop("style").removeProperty("left");
$(".foo").prop("style").removeProperty("background-color");

$.fn.removeCss=function(toDelete){

    var props=$(this).attr('style').split(';');
var tmp=-1;
for( var p=0;p<props.length; p++){if(props[p].indexOf(toDelete)!==-1){tmp=p}};
if(tmp!==-1){

   delete props[tmp];
}

  return $(this).attr('style',props.join(';')+';');

}

이 플러그인으로 안전하게 삭제하십시오!

$ ( 'myDiv'). removeCss ( 'color');

쉽게 제거 할 수없는 몇 가지 스타일이 있습니다.

해결 방법은 서로 다른 2 개의 클래스를 만들고 원하는 스타일이 포함 된 클래스를 추가 / 제거하는 것입니다.

쉽게 제거 / 비활성화 할 수있는 스타일 속성에 대한 최상의 솔루션은 아닙니다.

CSS 스타일을 제거하려면 스타일에 빈 문자열을 할당하십시오.

이 경우

$('.map').css({top:'',left:''});

 $("#map").css("top", "0"); 
 $("#map").css("left", "0");