"JQuery .after()"의 두 판 사이의 차이

(새 문서: ==개요== ;jQuery .after() * 대상 뒤에 내용을 추가(또는 이동)하는 jQuery 함수 ==예시 1: 신규 추가== <source lang='html5'> <script src="//code.jquery.com/jquer...)
 
잔글 (봇: 자동으로 텍스트 교체 (-</source> +</syntaxhighlight>, -<source +<syntaxhighlight ))
 
(같은 사용자의 중간 판 하나는 보이지 않습니다)
4번째 줄: 4번째 줄:


==예시 1: 신규 추가==
==예시 1: 신규 추가==
<source lang='html5'>
<syntaxhighlight lang='html5'>
<script src="//code.jquery.com/jquery.min.js"></script>
<script src="//code.jquery.com/jquery.min.js"></script>


13번째 줄: 13번째 줄:
$('.guys').after("<div>안녕~</div>");
$('.guys').after("<div>안녕~</div>");
</script>
</script>
</source>
</syntaxhighlight>
<jsfiddle height='140'>suagt9yb</jsfiddle>
<jsfiddle height='140'>suagt9yb</jsfiddle>


==예시 2: 이동 추가==
==예시 2: 이동 추가==
*선택자 입력시 원본이 이동됨<ref>단, 목적지 대상항목이 여러 개일 경우, 맨 뒤의 것이 원본이고, 나머지는 사본</ref>
*선택자 입력시 원본이 이동됨<ref>단, 목적지 대상항목이 여러 개일 경우, 맨 뒤의 것이 원본이고, 나머지는 사본</ref>
<source lang='html5'>
<syntaxhighlight lang='html5'>
<script src="//code.jquery.com/jquery.min.js"></script>
<script src="//code.jquery.com/jquery.min.js"></script>
   
   
28번째 줄: 28번째 줄:
$('.guys').after( $('.bye') );
$('.guys').after( $('.bye') );
</script>
</script>
</source>
</syntaxhighlight>
<jsfiddle height='140'>nfohcycn</jsfiddle>
<jsfiddle height='140'>nfohcycn</jsfiddle>


38번째 줄: 38번째 줄:
<references/>
<references/>


==참고 자료==
==참고==
*http://api.jquery.com/after/
*http://api.jquery.com/after/
*http://www.w3schools.com/jquery/html_after.asp
*http://www.w3schools.com/jquery/html_after.asp


[[분류: jQuery]]
[[분류: jQuery]]

2020년 11월 2일 (월) 02:53 기준 최신판

1 개요[ | ]

jQuery .after()
  • 대상 뒤에 내용을 추가(또는 이동)하는 jQuery 함수

2 예시 1: 신규 추가[ | ]

html
Copy
<script src="//code.jquery.com/jquery.min.js"></script>

<div class='guys'>한놈</div>
<div class='guys'>두시기</div>

<script>
$('.guys').after("<div>안녕~</div>");
</script>

3 예시 2: 이동 추가[ | ]

  • 선택자 입력시 원본이 이동됨[1]
html
Copy
<script src="//code.jquery.com/jquery.min.js"></script>
 
<div class='guys'>석삼</div>
<div class='guys'>너구리</div>
<div class='bye'>잘가~</div>
 
<script>
$('.guys').after( $('.bye') );
</script>

4 같이 보기[ | ]

5 주석[ | ]

  1. 단, 목적지 대상항목이 여러 개일 경우, 맨 뒤의 것이 원본이고, 나머지는 사본

6 참고[ | ]