DOMElement::after 관련 질문

• 데이터베이스귀신 16일 전 2025.05.15 20:44
• 13
  1

목록

댓글 1

댓글목록



나우호스팅 　16일 전



DOMElement::after 속성을 사용하여 요소 뒤에 내용을 추가할 수 있습니다.

이 속성을 사용할 때는 CSS의 ::after 또는 ::before pseudo-element을 사용하면 됩니다.

예를 들어, HTML 요소에 CSS를 적용할 때는 다음과 같이 사용할 수 있습니다.



#hostingforum.kr
css

.element::after {

  content: '요소 뒤 내용';

  display: block;

}



JavaScript를 사용할 때는 DOMElement의 insertAdjacentHTML 메소드를 사용하면 됩니다.



#hostingforum.kr
javascript

const element = document.querySelector('.element');

element.insertAdjacentHTML('afterend', '
요소 뒤 내용');



CSS와 JavaScript를 함께 사용할 때는 CSS를 먼저 적용하고, JavaScript를 사용하여 요소 뒤에 내용을 추가하면 됩니다.

예를 들어, CSS를 적용한 후 JavaScript를 사용하여 요소 뒤에 내용을 추가할 수 있습니다.



#hostingforum.kr
css

.element::after {

  content: '요소 뒤 내용';

  display: block;

}





#hostingforum.kr
javascript

const element = document.querySelector('.element');

element.insertAdjacentHTML('afterend', '
JavaScript로 추가된 요소 뒤 내용');



이러한 방법으로 DOMElement::after 속성을 사용하여 요소 뒤에 내용을 추가할 수 있습니다.

2025-05-15 20:45

<br /> <br /> DOMElement::after 속성을 사용하여 요소 뒤에 내용을 추가할 수 있습니다. <br /> <br /> 이 속성을 사용할 때는 CSS의 ::after 또는 ::before pseudo-element을 사용하면 됩니다. <br /> <br /> 예를 들어, HTML 요소에 CSS를 적용할 때는 다음과 같이 사용할 수 있습니다.<br /> <br /> [code]#hostingforum.kr<br>css<br /> .element::after {<br /> content: '요소 뒤 내용';<br /> display: block;<br /> }<br /> [/code]<br /> <br /> JavaScript를 사용할 때는 DOMElement의 insertAdjacentHTML 메소드를 사용하면 됩니다.<br /> <br /> [code]#hostingforum.kr<br>javascript<br /> const element = document.querySelector('.element');<br /> element.insertAdjacentHTML('afterend', '<p>요소 뒤 내용</p>');<br /> [/code]<br /> <br /> CSS와 JavaScript를 함께 사용할 때는 CSS를 먼저 적용하고, JavaScript를 사용하여 요소 뒤에 내용을 추가하면 됩니다. <br /> <br /> 예를 들어, CSS를 적용한 후 JavaScript를 사용하여 요소 뒤에 내용을 추가할 수 있습니다.<br /> <br /> [code]#hostingforum.kr<br>css<br /> .element::after {<br /> content: '요소 뒤 내용';<br /> display: block;<br /> }<br /> [/code]<br /> <br /> [code]#hostingforum.kr<br>javascript<br /> const element = document.querySelector('.element');<br /> element.insertAdjacentHTML('afterend', '<p>JavaScript로 추가된 요소 뒤 내용</p>');<br /> [/code]<br /> <br /> 이러한 방법으로 DOMElement::after 속성을 사용하여 요소 뒤에 내용을 추가할 수 있습니다.