728x90
반응형
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
<script type="text/javascript" src="js/jquery/jquery-1.7.2.js"></script>
<script type="text/javascript">
$('<p><a>JQuery</a></p>').find('a')
.end().appendTo('body');
</script>
</body>
</html>
<!--
$('<p><a>Jquery</a></p>')는 내부적으로 요소를 생성시켜줍니다.
이는 마치 기존 HTML문서에 <p>요소를 선택한것과 같은 효과입니다.
예를 들어 이 뒤에 .find()메서드를 체인하여 어트리뷰트를 설정할 수 있습니다.
$('<p><a>Jquery</a></p>').find('a').attr('href','#');
허나 아직 선택된 요소에 어트리뷰트를 추가한것뿐이지, DOM에 요소가 추가되지는 않았습니다.
appendTo는 선택된 요소를 DOM에 삽입하는 메서드입니다.
$('<p><a>Jquery</a></p>').find('a').attr('href','#').appendTo('body');
이는 <body>안에 <a>태그가 삽입되게 될것입니다. find를 사용하여 a태그가 선택이 되어있기 때문이지요
그걸 방지하기 위해 저번에 알아봤던 end()메서드를 사용할것입니다.
$('<p><a>Jquery</a></p>').find('a').attr('href','#').end().appendTo('body');
이제 body태그안에 p태그가 들어가게 됬습니다.
-->
[출처] [jQuery] DOM요소 추가하기|작성자 천방지축개발자
728x90
반응형
'JQUERY > 소스코드' 카테고리의 다른 글
| [jQuery] :selected (0) | 2014.09.29 |
|---|---|
| javascript jQuery changing style css 변경 (0) | 2014.09.23 |
| jsp07 액션 태그 jsp:include. 예제 3개 (0) | 2014.09.23 |
| 인풋박스에서 글씨 적혀있다가 커서 위치시 사라지는. (0) | 2014.09.05 |
| for문 출력 컨트롤 거꾸로 똑바로 등 (0) | 2014.09.05 |
| jQuery API: Core, Selector, Traversing (0) | 2014.08.19 |
| jQuery API: Attribute, CSS (0) | 2014.08.19 |
| Traversing 예제 (0) | 2014.08.19 |
nineDeveloper
안녕하세요 현직 개발자 입니다 ~ 빠르게 변화하는 세상에 뒤쳐지지 않도록 우리모두 열심히 공부합시다 ~! 개발공부는 넘나 재미있는 것~!