jQuery DOM 조작 Wrap()

요소를 다른 요소로 래핑하려는 경우, 즉 상위 요소를 추가하려는 경우 JQuery는 이러한 처리를 위한 래핑 메서드를 제공합니다

.wrap(wrappingElement): 컬렉션 HTML 구조에서 일치하는 각 요소 주위에 래퍼를 래핑합니다.

예를 들어 아래 예시를 작성해보겠습니다

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head>
<body>
    <p>php 中文网</p>


    <script>
        $("p").wrap("<div></div>");
    </script>
</body>
</html>

Friends, 위 코드를 보고 p 태그에 상위 노드를 추가합니다. Friends, 로컬에서 실행하려면 코드를 복사하고 F12를 눌러 보세요

Wrap( function ): 일치하는 요소를 래핑하는 데 사용되는 HTML 콘텐츠 또는 jQuery 객체를 반환하는 콜백 함수

사용 후 효과는 코드를 함수 본문 내부에 작성할 수 있다는 점을 제외하면 매개변수를 직접 전달하는 것과 동일합니다. 방법이 다릅니다

예를 살펴보겠습니다.

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head>
<body>
    <p>php 中文网</p>

    <script>
        $('p').wrap(function(){
            return '<div>';
        })
    </script>
</body>
</html>

친구가 두 번째를 실행할 수 있습니다. 사실 효과는 첫 번째와 동일하지만 작성 방법이 다릅니다

참고: Wrap() 함수는 DOM 구조를 지정하기 위해 $() 팩토리 함수에 전달될 수 있는 모든 문자열이나 객체를 받아들일 수 있습니다. 이 구조는 여러 수준 깊이로 중첩될 수 있지만 핵심 요소만 포함해야 합니다. 일치하는 각 요소는 이 구조로 래핑됩니다. 이 메서드는 나중에 체인 메서드를 사용할 수 있도록 원래 요소 집합을 반환합니다.

지속적인 학습

새로운 파일

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script> </head> <body> <p>php 中文网</p> <script> $("p").wrap("<div></div>"); </script> </body> </html>

제출하다 코드 재설정

자동운전