5. jquery Method [ .append() ] - 선택한 요소의 내용 끝에 추가하는 메소드

jQuery/Method

2020. 2. 19. 09:56

5. jquery Method [ .append() ] - 선택한 요소의 내용 끝에 추가하는 메소드

문법

.append(content)

예를 들어

1. $("ul").append("<li>GHIJK</li>");
2. $("p").append("하세요?");

1. ul태그 내용 끝에 내용을 추가해줍니다.

2. p태그 내용 긑에 내용을 추가 해줍니다.

예제 코드

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<html>
	<head>
		<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
		<title>Home</title>
	</head>
	<script type="text/javascript">
    $(document).ready(function(){
      $("ul").append("<li>GHIJK</li>");
      $("p").append("하세요?");
    });
	</script>
	<body>
		<ul>
			<li>ABC</li>
			<li>DEF</li>
		</ul>
		<div>
			<p>안녕</p>
		</div>
	</body>
</html>

$("ul").append("<li>GHIJK</li>");

- ul태그 내용 끝에 li태그와 "GHIJK"내용이 생깁니다.

$("p").append("하세요?");

- p태그 내용 끝에 "하세요?" 내용이 생깁니다.

실행 테스트