jQueryで子ノードにアクセスする方法 children

jQueryで直接の子ノードを調べるには、

$('#messages').children();

で調べられます。

children( [expr] );

こういうHTMLがあるときに、

<div id="messages">
<div id="message1">div 1</div>
<div id="message2">div 2</div>
<div id="message3">div 3</div>
<div id="message4"> <div id="sub">sub</div> </div>
<p id="p1">p1</p>
</div>

children()は、下記を返します。

[div#message1, div#message2, div#message3, div#message4, p#p1]

jQueryのchainを使って、子ノードを書き換えてみます。

$('#messages').children().html('My Child');

#messagesの子のdivだけを書き換えるには、children()にexprを指定します。

$('#messages').children('div').html('My Child');

スタイルシートを変えてみる。

 $('div#messages').children().css("color", "blue");

いつもシェア、ありがとうございます！

もっと情報を探しませんか？

過去ログ

2020 : 01 02 03 04 05 06 07 08 09 10 11 12
2019 : 01 02 03 04 05 06 07 08 09 10 11 12
2018 : 01 02 03 04 05 06 07 08 09 10 11 12
2017 : 01 02 03 04 05 06 07 08 09 10 11 12
2016 : 01 02 03 04 05 06 07 08 09 10 11 12
2015 : 01 02 03 04 05 06 07 08 09 10 11 12
2014 : 01 02 03 04 05 06 07 08 09 10 11 12
2013 : 01 02 03 04 05 06 07 08 09 10 11 12
2012 : 01 02 03 04 05 06 07 08 09 10 11 12
2011 : 01 02 03 04 05 06 07 08 09 10 11 12
2010 : 01 02 03 04 05 06 07 08 09 10 11 12
2009 : 01 02 03 04 05 06 07 08 09 10 11 12
2008 : 01 02 03 04 05 06 07 08 09 10 11 12
2007 : 01 02 03 04 05 06 07 08 09 10 11 12
2006 : 01 02 03 04 05 06 07 08 09 10 11 12
2005 : 01 02 03 04 05 06 07 08 09 10 11 12
2004 : 01 02 03 04 05 06 07 08 09 10 11 12
2003 : 01 02 03 04 05 06 07 08 09 10 11 12