[자바 스크립트] style.display = ''는 실제로 무엇을합니까?

예, 인라인 "display : none"을 비워서 요소의 표시 속성을 기본값으로 재설정하여 페이지의 순위 CSS 규칙에 정의 된대로 요소가 표시 속성으로 돌아가도록합니다.예를 들어 다음

<div>

은 ID가 "myElement"인 a입니다.

<div id="myElement"></div>

A

<div>

는

display:block

기본적으로 설정 되어 있습니다. 스타일 시트에서 다음

<div>

과 같이 표시되도록 지정한다고 가정합니다

table

.

div#myElement
{
    display:table;
    }
    

페이지를로드하면

<div>

이로 표시됩니다

table

.

<div>

스크립팅으로 이것을 숨기려면 다음 중 하나를 수행 할 수 있습니다.

// JavaScript:
document.getElementById("myElement").style.display = 'none';

// jQuery:
$("#myElement").toggle(); // if currently visible
$("#myElement").hide();
$("#myElement").css({"display":"none"});

이 모든 것들은 같은 효과

style

를 가지고 있습니다

<div>

: 당신 의에 인라인 속성을 추가하는 것 :

<div id="myElement" style="display:none"></div>

요소를 다시 표시하려면 다음 중 하나가 작동합니다.

// JavaScript:
document.getElementById("myElement").style.display = "";

// jQuery:
$("#myElement").toggle(); // if currently hidden
$("#myElement").show();
$("#myElement").css({"display":""});

다음

display

은 인라인

style

속성 에서 CSS 속성을 제거합니다 .

<div style=""></div>

인라인 스타일은 더 이상을 지정 이후

display

의는

<div>

로 표시되고 다시 간다

table

우리는 스타일 시트에 넣어 그 무엇의 때문에. 는

<div>

않습니다

하지

로 표시되는으로 되돌아

block

기본 설정 우리의 CSS의 오버라이드 때문에; 인라인

display

속성을 비워도 스타일 시트의 규칙이 무효화되지는 않습니다.

---

웃음의 경우, 내 대답을 확인하는 데 사용한 Google 쿼리는 다음과 같습니다.

javascript style display empty string default

... 그리고 이것이 언급 된 몇 개의 링크 :

http://jszen.blogspot.com/2004/07/table-rowsrevealed.html

http://www.harrymaugans.com/2007/03/05/how-to-create-a-collapsible-div-with-javascript-and-css/

(기사에는 없지만 댓글 섹션에 있음)-------------------

display

스타일을 해당 요소의 기본값으로 설정합니다 . 전부는 아니지만 대부분의 요소에서 기본값은

none

.-------------------
기본값이 사용되도록 표시 속성 값을 제거합니다.그것은

하지 않습니다

원래의 디스플레이 속성을 다시 설정합니다.예를 들어 다음과 같은 경우 :

<span id="test" style="display:block;">b</span>

그리고 이렇게하십시오 :

document.getElementById('test').style.display = 'inline';
document.getElementById('test').style.display = '';

 

display

요소에 사용 된 스타일은 요소

inline

의 기본값이기 때문에 결국 HTML 코드에 지정된 스타일로 재설정되지 않습니다.-------------------

null

기본적으로 설정된 내용을 지우고 기본값으로 되 돌리는 해당 요소의 디스플레이에 대한 CSS를 설정합니다.

출처
https://stackoverflow.com/questions/7420109