>웹 프론트엔드 >JS 튜토리얼 >JS는 숨기기 및 표시를 제어합니다.

JS는 숨기기 및 표시를 제어합니다.

不言
不言원래의
2018-04-26 14:29:111821검색

이 기사에서는 숨겨진 디스플레이를 제어하는 ​​비교적 간단한 JS 코드를 공유합니다. 도움이 필요한 친구들은 이를 살펴볼 수 있습니다.

상대적으로 간단한 구현 style.display는 레이어의 숨김 또는 표시 속성을 제어하는 ​​속성입니다.

<html>
<body>
<script>
function show(){
document.getElementById("p").style.display="";
//alert(document.getElementById("p").style.display)
}
function hidden(){
document.get
ElementById("p").style.display="none";
//alert(document.getElementById("p").style.display)
}
</script>
<BODY>
<input name="name" type="button" onClick="show();" value="显示">
<p id="p" style="display: none" onMouseout="hidden();">
show it
</p>
</BODY>
</HTML>

p의 visibility는 p의 표시 및 숨기기를 제어할 수 있지만 숨긴 후에는 페이지가 공백이 됩니다.

style="visibility: none;"
document.getElementById("typep1").style.visibility="hidden";//隐藏
document.getElementById("typep1").style.visibility="visible";//显示


display 속성을 설정하면 점유된 페이지 공간이 이후에 해제될 수 있습니다. p는 숨겨져 있습니다, 다음과 같이

style="display: none;"
document.getElementById("typep1").style.display="none";//隐藏
document.getElementById("typep1").style.display="";//显示

p.style.display="none"을 사용하여 숨기면 p에 있는 항목이 잠자기 상태가 되고 그 안의 이벤트가 응답하지 않습니다




위 내용은 JS는 숨기기 및 표시를 제어합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.