9
domA.style.display = "none"; domA.style.display = "블록;.Google 폐쇄에서 dom 요소를 숨기거나 표시하는 방법
내가 도서관에서 같은 기능을 찾을 수 있지만, 나는 그들이 어딘가에 있어야합니다 생각
A
답변
15
<html>
<head>
<script src="http://closure-library.googlecode.com/svn/trunk/closure/goog/base.js" type="text/javascript"></script>
<script language="JavaScript">
goog.require('goog.style');
</script>
</head>
<body>
<div id="myElement">test</div>
</body>
</html>
<script>
goog.style.setStyle(goog.dom.$("myElement"), "display", "none");
// or
goog.style.showElement(goog.dom.$("myElement"), false);
</script>
4
또 다른 옵션은
VAR ELA = goog.dom.getElementByClass ('자위대');
goog.style.showElement (ELA, TRUE) // 쇼 요소
goog.style.showElement (ELA, FALS 전자) // 숨기기 요소
+4
이것은 더 이상 사용되지 않습니다. 대신 setElementShown()을 사용하십시오. – jdbertron
4
official documentation here 더 최근에 따르면, 다음은 setStyle 권장 :
은 요소에 스타일의 값을 설정합니다. ... 가능한 경우 네이티브 API를 사용하십시오 : elem.style.propertyKey = 'value'또는 (오래된 스타일을 지우면 이 좋음) elem.style.cssText = 'property1 : value1; property2 : value2 '.
귀하의 질문과 마찬가지로 goog.dom.getElement('myElement').style.display = 'block';이 제안됩니다.
showElement을 사용하는 경우 두 번째 인수를 true으로 설정하면 해당 요소가 default style으로 반환됩니다. 내용 :
요소를 기본 스타일로 렌더링하려면 True로 설정하고 요소를 렌더링하려면 을 사용하지 않으려면 false로 설정합니다.
이 의미
하지만, 당신이 당신의 CSS에서 display: none, true 설정을 설정하면 CSS의 기본 스타일 요소를 숨길 수 있기 때문에 여전히 요소가 표시되지 것입니다! 이것은 말하자면 jQuery와 다릅니다. 전환하려면
, 당신은이 작업을 수행 할 수 있습니다
var el_style = goog.dom.getElement('myElement').style;
el_style.display = (el_style.display === "none" ? "block" : "none");
+0
"공식 문서는 여기"링크가 깨졌습니다. – jochen
을 사람들이 폐쇄 그룹에 말에 따르면, $ 함수는 아마 goog.dom.getElement에 찬성 제거됩니다 ('myElement') 스타일의 기능 – Evgeny
이 접근 방식은 현재 구식입니다. – Nick