jQuery wrapとunwrap親要素を追加と削除
jQuery wrap 親要素を追加
wrapは親要素を追加します
サンプル
$(“セレクタ”).wrap(‘タグ’)
サンプル
<html>
<head>
<script src=”jquery-3.2.1.js”></script>
<script>
$(document).ready(function(){
$(“.red”).wrap(‘<div></div>’)
$(“div”).css(“color”,”red”)
});
</script>
<title>
</title>
</head>
<body>
<h3 class=”red”>red</h3>
<h3>Green</h3>
<h3>yellow</h3>
<h3>Blue</h3>
</body>
</html>
実行結果は
divが追加されてdivにcssで赤に設定されています。
jQuery unwrap親要素を削除
unwrapは親要素を削除します。
サンプル
$(“セレクタ”).unwrap(‘タグ’)
サンプル
<html>
<head>
<script src=”jquery-3.2.1.js”></script>
<script>
$(document).ready(function(){
$(“.red”).wrap(‘<div></div>’)
$(“.red”).unwrap(‘<div></div>’)
$(“div”).css(“color”,”red”)
});
</script>
<title>
</title>
</head>
<body>
<h3 class=”red”>red</h3>
<h3>Green</h3>
<h3>yellow</h3>
<h3>Blue</h3>
</body>
</html>
実行結果は
色は変わりません。
divを作成して削除されているのでdivにかけているcssは適応されず色は変わりません。
