.contents()
- .contents( ) 1.2追加
- デモ
.contents( ) 1.2追加
戻り値:jQuery
テキストやHTMLコメントを含む子要素を取得します。
- .children()との違いは、テキストノード、コメントノードも対象とする点です。
- iframe(同じドメイン内)を参照する際に、よく使用されるメソッドです。
デモ
テキストノードをBRで区切った整理されていないHTMLを、 contents()メソッドを使って、それぞれの段落を<P>で囲って修正しています。
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<style>p {border:1px red solid;}</style>
</head>
<body>
<div class="container">
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed
do eiusmod tempor incididunt ut labore et dolore magna aliqua.
<br /><br />
Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat.
<br /> <br />
Duis aute irure dolor in reprehenderit in voluptate velit
esse cillum dolore eu fugiat nulla pariatur.
</div>
<script>
$('.container').contents().filter(function() {
return this.nodeType == 3;
})
.wrap('<p></p>')
.end()
.filter('br')
.remove();
</script>
</body>
</html>
P要素内のテキストノードを取り出して、Bタグで囲います。
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<p>こんにちは、<a href="http://ejohn.org/">ジョン</a>。 調子はどうですか?</p>
<script>
$("p").contents().filter(function(){
return this.nodeType != 1;
}).wrap("<b/>");
</script>
</body>
</html>
© 2010 - 2017 STUDIO KINGDOM