• 회원가입
  • 로그인

[Traversing] JQ - add() 메서드 ★ - 일치하는 요소 집합에 지정 요소가 추가된 새 jQuery 객체 생성. (= add메서드 = 애드메서드)

목차
  1. add() 예제 - p와 모든 span 요소에 배경색 추가
  2. add() 예제 - p와 첫 번째 span 요소만 배경색 추가
  3. add() 예제 - p에 span 요소 생성해 붙이기
  4. add() 정의
  5. add() 구문

 

add() 예제 - p와 모든 span 요소에 배경색 추가

 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<script>

$(document).ready(function(){

    $("h1").add("p").add("span").css("background-color", "yellow");

});

</script>


<h1>홈짱닷컴</h1>

<p>Homzzang.com</p>

<p>홈페이지 제작 강의</p>

<span>HTML</span>

<span>CSS</span>

<span>JS</span>

<br><br>

<div>그누보드, 영카트 계열 빌더 테마 연구</div>


결과 보기

 

add() 예제 - p와 첫 번째 span 요소만 배경색 추가

 
$("h1").add("p").add(document.getElementsByTagName("span")[0]).css("background-color", "yellow");

 


add() 예제 - p에 span 요소 생성해 붙이기

 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<script>

$(document).ready(function(){

    $("button").click(function(){

        $("p").add("<br><span>Homzzang.com</span>").appendTo("p");

    });

});

</script>


<button>암기해!</button>

<p>홈짱닷컴 주소 잊지 마.</p>


결과 보기

 

add() 정의


일치하는 요소 집합에 지정 요소가 추가된 새 jQuery 객체 생성.

 



1.
전체 문서에 요소를 추가하거나,
context 매개변수 지정된 경우 context 요소 내부에 요소를 추가.

 

2. jQuery add() 예제 보기

https://api.jquery.com/add/

 

 

add() 구문

 

$(selector).add(element,context)

 


[매개변수]

 

element
필수. 기존 요소그룹에 추가할 선택자.
기존 요소 그룹에 추가할 (jQuery 객체, 하나 이상의 요소, 또는 HTML 정보)를 지정.

 

context
선택. 선택자 일치 여부를 판별 시작해야하는 문서의 지점을 지정.



 

방문 감사합니다. (즐겨찾기 등록: Ctrl + D)

찾아주셔서 감사합니다. Since 2012