SoloLearn jQuery 번역

Remove Elements

element 제거하기

• We remove selected elements from the DOM using the remove() method.
  • remove() 메소드를 사용해서, DOM에서 선택한 element를 제거한다.

• HTML:

<p style="color:red">Red</p>
<p style="color:green">Green</p>
<p style="color:blue">Blue</p>

• JS:

$("p").eq(1).remove();

코드 실행 확인

• This removes Green, the second paragraph element.
  • 위 코드는 두 번째 p element인 Green을 제거한다.
• You can also use the remove() method on multiple selected elements.
  • remove() 메소드를 선택한 여러 element에 사용할 수도 있다.
• $("p").remove() removes all paragraphs.
  • $("p").remove()는 모든 p element를 제거한다.

The jQuery remove() method removes the selected element(s), as well as its child elements.

jQuery remove() 메소드는 선택한 element뿐만 아니라, 그 child(자식) element도 제거한다.

Removing Content

내용 제거하기

• The empty() method is used to remove the child elements of the selected element(s).
  • empty() 메소드는, 선택한 element의 chlid(자식) element를 제거하는 데 사용된다.

• HTML:

<div>
  <p style="color:red">Red</p>
  <p style="color:green">Green</p>
  <p style="color:blue">Blue</p>
</div>

• CSS:

div {
  background-color: aqua;
  width: 300px;
  height: 200px;
}

• JS:

$("div").empty();

코드 실행 확인

This removes all the three child elements of the div, leaving it empty.

위 코드는 div의 세 child element 모두를 제거한다.

QUIZ

• Fill in the blanks to remove all siblings of the element with id=”txt”.
  • id=”txt” element의 모든 siblings를 제거해라.

$("#txt").siblings().remove();

• Fill in the blanks to empty the second child element of the element with id=”nav”.
  • id=”nav” element의 두 번째 child element를 제거해라.

var e = $("#nav").children();
e.eq(1).empty();