이 기사의 예에서는 JQuery로 DOM 노드를 래핑하는 방법을 설명합니다. 참고할 수 있도록 모든 사람과 공유하세요. 구체적인 분석은 다음과 같습니다.
노드를 다른 태그로 래핑하려는 경우 JQuery는 해당 메서드인 Wrap()을 제공합니다. 이는 문서에 구조화된 추가 태그를 삽입하는 데 매우 유용하며 원래 문서 의미를 파괴하지 않습니다.
랩()
얻은 결과는 다음과 같습니다.
<strong> <li id="li_1" title="PHP编程">简单易懂的PHP编程</li> </strong>
노드 작업을 래핑하는 데는 WrapAll()과 WrapInner()라는 두 가지 다른 방법이 있습니다.
wrapAll() 메서드
이 방법은 일치하는 모든 요소를 하나의 요소로 래핑합니다. 모든 요소를 개별적으로 래핑하는 Wrap() 메서드와는 다릅니다. JQuery 코드는 다음과 같습니다.
wrapAll() 메소드를 사용하여 래핑된 HTML은 다음과 같습니다.
<strong> <li class="li_2" title="C编程">简单易懂的C编程</li> <li class="li_2" title="JavaScript编程">简单易懂的JavaScript编程</li> </strong>
wrapInner() 메서드
이 방법은 일치하는 각 요소의 하위 콘텐츠(텍스트 노드 포함)를 다른 구조화된 마크업으로 래핑합니다.
코드를 실행한 결과 태그의 내용이 한 쌍의
<li id="li_4" title="JQuery"> <strong>简单易懂的JQuery编程</strong> </li>
이 예제의 JQuery 코드는 다음과 같습니다.
<script type="text/javascript">
//<![CDATA[
$(function(){
$("#btn_1").click(function(){
//用<strong>元素把<li>元素包裹起来
$("#li_1").wrap("<strong></strong>");
})
$("#btn_2").click(function(){
$(".li_2").wrapAll("<strong></strong>");
})
$("#btn_3").click(function(){
$("#li_4").wrapInner("<strong></strong>");
})
});
//]]>
</script>이 기사가 모든 사람의 jQuery 프로그래밍에 도움이 되기를 바랍니다.
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
