【IT支援部】jQuery(メソッド)

Author:

メソッドまわりはここに追記していこう。

append

要素を後ろに追加。
$(‘#xxx’).append(‘<div>aaa</div>’);
<div id=”xxx”><p>yyy</p></div>
これが
<div id=”xxx”><p>yyy</p><div>aaa</div></div>
になる。

prepend

要素を手前に追加。
$(‘#xxx’).append(‘

aaa

‘);
<div id=”xxx”><p>yyy</p></div>
これが
<div id=”xxx”><div>aaa</div><p>yyy</p></div>
になる。

children

配下の要素をまとめて取得する。
childrenは子の要素だけを変更するため、孫要素で別のスタイルが指定していたら変更されない。

find

配下の要素の中で条件にマッチするものを取得する。
孫要素にも条件にマッチするものがあれば、それも取得対象になる。

css

CSSを取得、または設定する。
.css(‘color’) // colorスタイルを取得
.css(‘color’, ‘#fff’) // colorスタイルを設定
.css(‘color’, function(){}) // 関数の戻り値をcolorスタイルに設定

addClass,removeClass

クラスを設定、または削除する。取得はattrメソッドで。
.addClass(‘image’) // imageクラスを設定
.removeClass(‘image’) // imageクラスを削除

attr

属性を取得、または設定する。
.attr(‘id’) // idを取得
.attr(‘id’, ‘main’) // idを設定
.attr(‘id’, function(){}) // 関数の戻り値をidに設定
.removeAttr(‘id’) // idを削除

remove

要素をまるごと削除。
$(‘#aaa’).remove();

detach

削除するけど一旦保存して後で復活可能。
var node = $(‘#aaa’).detach();
node.appendTo(‘#xxx’);

関連記事

jQueryのセレクタの基本
jQueryが動かなかった理由

Facebook にシェア
Pocket