πΉ jQuery - manipulation [outside]
π outside μμ보기
after() - μ§μ ν μμ λ€μ μλ‘μ΄ μμλ₯Ό μ½μ
insertAfter() - μ§μ ν μμ λ€μ μλ‘μ΄ μμλ₯Ό μ½μafter()μ insertAfter()λ λμΌν κΈ°λ₯μ μννμ§λ§, μ½μ λ λ΄μ©κ³Ό νκ²μ μμΉκ° λ€λ¦ λλ€.
A.after(B) β A λ€μ Bλ₯Ό μΆκ°
A.insertAfter(B) β B λ€μ Aλ₯Ό μΆκ°
before() β μ§μ ν μμμ μμ λΆλΆμ λ΄μ©μ μ½μ
insertBefore() β μ§μ ν μμμ μμ λΆλΆμ λ΄μ©μ μ½μbefore()μ insertBefore()λ λμΌν κΈ°λ₯μ μννμ§λ§, μ½μ λ λ΄μ©μ νκ²μ μμΉκ° λ€λ¦ λλ€.
A.before(B) β A μμ Bλ₯Ό μΆκ°
A.insertBefore(B) β B μμ Aλ₯Ό μΆκ°
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>day65-4_manipulation_outside.html</title>
<script src="js/jquery-3.6.0.min.js"></script>
<script src="js/day65-4_script.js"></script>
</head>
<body>
<h2>μ νλ μμ λ°κΉ₯μͺ½μ μμ λ§λ€κΈ°</h2>
<!-- μμμ outside -->
<div class="box">
<!-- μμμ inside -->
</div>
<!-- μμμ outside -->
</body>
</html><script>
$(function(){
//inside
$('.box').html('<ul></ul>');
$('.box ul').append('<li></li>');
//μμ.after('νκ·Έ) μ νλ μμ μ΄νμ λ§λ€μ΄ μ§λλ€.
$('.box ul il').after('<li></li>');
//μμ.before('νκ·Έ) μ νλ μμ μ΄μ μ λ§λ€μ΄ μ§λλ€.c
$('.box ul ').before('<ol></ol>');
//h2μμλ₯Ό olκ³Όul μ¬μ΄λ‘ μ΄λμν€μΈμ
//$('h2').insertBefore('ul');
$('h2').insertAfter('ol');
});
</script>
μ΄μ μ΄μ μ΄μ π₯