jQuery에서 insertBefore(), insertAfter(), after() 및 before()의 차이점 소개
- 巴扎黑원래의
- 2017-06-24 13:17:311421검색
이 글은 jQuery에서 insertBefore(), insertAfter(), after(), before()의 차이점에 대한 관련 정보를 주로 소개합니다. 매우 좋고 참고할만한 가치가 있습니다. can 참고로
insertBefore():a.insertBefore(b)
a는 앞에 있고, b는 뒤에 있습니다.
a:는 선택자이고, b:도 선택자입니다
<!DOCTYPE html>
<html>
<head>
<meta charset='UTF-8'>
<title>jqu</title>
<script type="text/javascript" src='jquery-2.2.0.min.js'></script>
</head>
<body>
<p class='p1'>p1:hello</p>
hello world
<p class='p2'>p2:wenwen</p>
hello wo
</body>
<script type="text/javascript">
$(function(){
$('.p2').insertBefore('.p1');
})
</script>
</html>Get:
p2:wenwen p1:hello hello world hello wo
insertAfter(): insertBefore()와 동일합니다
a.insertAfter(b)
a가 뒤에 오고, b가 앞에 옵니다
이제는 이전입니다 ()
before():a.before()
a는 이미 페이지에 있는 선택자이고, b는 추가해야 하는 콘텐츠입니다. 참고: 이것이 바로 태그를 인식하며, b는 a가 아닙니다. selector
a 뒤에 b, 앞에 b
<!DOCTYPE html>
<html>
<head>
<meta charset='UTF-8'>
<title>jqu</title>
<script type="text/javascript" src='jquery-2.2.0.min.js'></script>
</head>
<body>
<p class='p1'>p1:hello</p>
<p class='p2'>p2:wenwen</p>
</body>
<script type="text/javascript">
$(function(){
$('.p2').before('.p1');
})
</script>
</html> 마침내 얻었습니다:
p1:hello .p1 p2:wenwen
보셨나요? .p1은 선택기를 인식하지 못합니다. .p2 선택기 앞에 직접 string이 있습니다.
after(): 하나가 앞에 있고 다른 하나가 뒤에 있다는 점을 제외하면 before()와 동일합니다
insertBefore(), insertAfter() 및 before(), after()의 차이점을 말씀드리고 싶습니다. 위치를 바꿔야 하는 경우 사용하려는 시나리오에 따라 가장 큰 차이점이 있다고 생각합니다. 두 선택기 중
insertBefore(), insertAfter()
텍스트와 위치를 교환하기 위한 선택기가 필요한 경우 before(), after()를 사용할 수 있습니다. 물론 이는 단순한 교환이 아닙니다. position
위치를 바꾸는 것은 페이지에 이미 존재한다는 의미입니다. 이 방법은 다음과 같이 페이지에 없는 항목을 추가할 수도 있습니다:
$('<p class='p3'>嘿嘿</p>').insertBefore('.p1');
위 내용은 jQuery에서 insertBefore(), insertAfter(), after() 및 before()의 차이점 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!