[jQuery - 기능 - (6) ] .prepend() → 선택한 요소의 내용의 앞에 콘텐트를 추가하는 메서드
$.prepend()
.prepend()는 선택한 요소의 내용의 앞에 콘텐트를 추가하는 기능을 한다.
문법
|
1
|
.prepend( content [, content ] )
|
간단한 예시
|
1
2
3
4
5
6
7
8
9
|
//소스
<p>Lorem Ipsum Dolor</p>
<script>
$( 'p' ).prepend( '123 ' );
</script>
//결과
<p>123 Lorem Ipsum Dolor</p>
|
예시
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
|
<!doctype html>
<html lang="ko">
<head>
<meta charset="utf-8">
<title>jQuery</title>
<style>
body {
line-height: 2;
font-family: sans-serif;
font-size: 20px;
}
</style>
<script src="//code.jquery.com/jquery-3.3.1.min.js"></script>
<script>
$( document ).ready( function() {
$( 'ul' ).prepend( '<li>Dolor</li>' );
} );
</script>
</head>
<body>
<ul>
<li>Lorem</li>
<li>Ipsum</li>
</ul>
</body>
</html>
Color Scripter
|
코드 실행 : https://www.w3schools.com/code/tryit.asp?filename=G73V64OXM7NF
'◽ HTML & CSS & JS, jQuery' 카테고리의 다른 글
| [HTML] <input>태그 값 못 쓰게 막기. readonly, disabled (0) | 2019.08.26 |
|---|---|
| [jQuery 기록] 반복문에서 고유값 불러오는 값이 항상 일정한 문제. (0) | 2019.08.21 |
| [jQuery - 기능 - (7) ] .serialize() → 폼 요소 집합을 인코딩 - jQuery제공 메서드 (0) | 2019.08.17 |
| [jQuery - 기본 - (2) ] $(function(){}) ▶ $(document).ready(function(){ }) 같은 의미 (0) | 2019.08.14 |
| [jQuery - 기능 - (6) ] $.ajax(), $.getJSON → JSON 데이터 (0) | 2019.08.14 |
| [jQuery - 기능 - (5) ] $.validate() - (2) : errorPlacement - validate 메시지 위치 설정하기 (0) | 2019.08.13 |
| [jQuery - 기능 - (5) ] $.validate() - (1) : 유효성 검사 [ 확인 문구 바로 출력 ] (0) | 2019.08.12 |