추가, 앞에 추가 및 이전과 같은 요소를 추가하는 jQuery 메서드

jQuery - 요소를 추가하는 방법은 append, prepend, before 등 여러 가지가 있습니다. 자세한 소개는 다음과 같습니다

1.jQueryappend() 메소드

jQueryappend() 메소드는 선택한 요소의 끝에 내용을 삽입합니다.
Example

코드는 다음과 같습니다.

$("p").append(" 일부 추가된 텍스트.");

2.jQuery prepend() 메서드

jQuery prepend() 메서드는 선택한 요소의 시작 부분에 내용을 삽입합니다.
Example

코드는 다음과 같습니다.

$( "p").prepend("앞에 텍스트가 추가되었습니다. ");

3, after() 및 before() 메서드
jQuery after() 메서드는 선택한 요소 뒤에 콘텐츠를 삽입합니다.
jQuery before() 메서드는 콘텐츠를 삽입합니다.
예제

코드 다음과 같습니다:

$("img").after("다음 텍스트")
$("img").before("앞 텍스트")

편집기가 아래에 몇 가지 세부 정보를 추가합니다.

추가() 메서드는 선택한 요소의 끝에 콘텐츠를 삽입합니다.

prepend() 메서드는 선택한 요소의 시작 부분에 콘텐츠를 삽입합니다. 메소드는 요소를 선택하기 전에 컨텐츠를 삽입합니다.

데모 코드:

<script type="text/javascript" src="http://common.jb51.net/jslib/jquery/jquery.min.js"></script>
<p class="testp">
  <ul>
    <li>第一个li标签</li>
  </ul>
</p>

<script>

  //append
  $(&#39;.testp ul&#39;).append(&#39;<li>append 插入的li</li>&#39;);
  //prepend
  $(&#39;.testp ul&#39;).prepend(&#39;<li>prepend 插入的li</li>&#39;);
  //after
  $(&#39;.testp ul&#39;).after(&#39;<li>after 插入的li</li>&#39;);
  //before
  $(&#39;.testp ul&#39;).before(&#39;<li>before 插入的li</li>&#39;);

</script>

실행 후 렌더링:

html 구조 다이어그램

위 내용은 추가, 앞에 추가 및 이전과 같은 요소를 추가하는 jQuery 메서드의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!