나는 방법을 배우려고 노력하기 숨기기 <div> 섹션은 웹 페이지에서 javascript getElementsByClassName("<classname>").outerHTML="".
이 모든 작동하는 경우 요소 난 숨기 예: <div class="someclassname">Some content I want to hide</div>. 또는,내가 성공을 사용하는 경우 getElementByID("<divId>") 로 작업하는 경우 예: <div id="somedivID">.
문제입니다,하고자 할 때 숨기기 <div> 가 없는 id 고 있을 때에 여러 이름이 나와 있 div 의 클래스는 아래와 같은:
<div class="cake forest carousel">Some content I want to hide.</div>
할 수 있는 방법을 숨길 div 하지 않은 id 및 단일 클래스 이름?
클래스를 사용할 수 있습니다 document.querySelectorAll() 와 함께 css selectors 은 다음과 같습니다.
document.querySelector('button').addEventListener('click', () => {
document.querySelectorAll('.cake')[0].style.display = 'none';
});<div class="cake forest carousel">Some content I want to hide.</div>
<button>Hide content</button>로 클래스 이름을 기억 지정할 수 있는 모든 클래스 이름(때로는 유용한 정확히 한 요소가 있을 경우는 다른 요소의 일부를 포함 classList:
document.querySelectorAll('.cake.forest.carousel')[0] . . .
또한 note document.querySelectorAll() 반환 컬렉션,문자열이 아닙-는 데 필요한 이유입 사용 [0] 표기법을 선택하는 첫 번째 요소를 반환할 수 있습니다.
용 getElementsByClassName() 는 많은 동일한 아이디어로 다시,그것은 컬렉션을 반환하고 해야 하나 하나를 사용하여 [0] 표기를 얻는 첫 번째 요소는(일반적으로 하나만 있으면 반환한),또는 forEach() 루프를 선택하여 원하는 요소 기타 기준에 따라.
document.querySelector('button').addEventListener('click', () => {
document.getElementsByClassName('cake forest')[0].style.display = 'none';
});<div class="cake forest carousel">This div has classes cake, forest and carousel</div>
<div class="cake">This div only has class cake</div>
<button>Hide divs with classes cake AND forest</button>