jQuery는 prepend() 및 prependTo()를 삽입합니다.
append 및 AppendTo를 통해 선택한 요소의 끝(여전히 내부)에 지정된 콘텐츠를 삽입하는 것 외에도 jQuery에서 제공하는 메서드는 prepend 및 prependTo
입니다.선택기 설명:
설명을 위해 예제를 작성해 보겠습니다.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>prepend与prependTo</title>
<script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head>
<body>
<ul>
<li id="li1">php 中文网</li>
<li id="li2">php.cn</li>
</ul>
<input type="button" id="ipt1" value="prepend">
<input type="button" id="ipt2" value="prependTo">
<script>
$("#ipt1").click(function(){
$('#li1').prepend("欢迎</br>");
})
$("#ipt2").click(function(){
$('#li2').prepend("欢迎</br>");
})
</script>
</body>
</html>참고: prepend()와 .prependTo()는 동일한 기능을 구현합니다. 주요 차이점은 구문과 삽입되는 내용입니다.
다음은 네 가지 내부 작업 방법 간의 차이점을 요약한 것입니다.
Append()는 일치하는 각 요소에 콘텐츠를 추가합니다.
prepend()는 일치하는 각 요소 앞에 콘텐츠를 추가합니다.
appendTo() 일치하는 모든 요소를 추가합니다. 지정된 요소의 다른 집합에
prependTo() 일치하는 모든 요소를 지정된 요소의 다른 집합 앞에 추가합니다.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>prepend与prependTo</title>
<script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head>
<body>
<ul>
<li id="li1">php 中文网</li>
<li id="li2">php.cn</li>
</ul>
<input type="button" id="ipt1" value="prepend">
<input type="button" id="ipt2" value="prependTo">
<script>
$("#ipt1").click(function(){
$('#li1').prepend("欢迎</br>");
})
$("#ipt2").click(function(){
$('#li2').prepend("欢迎</br>");
})
</script>
</body>
</html>
