JQuery を使ったテキスト操作のまとめ
基本の形
function(){
$('ターゲット').メソッド('入力したいテキスト');
}書き換え
$('ターゲット').text('書き換えたいテキスト');ターゲットのテキストを書き換える
.text(”); とすると空欄になり、テキストを消すことができる
先頭に追加
$('ターゲット').prepend('追加したいテキスト');ターゲットのテキストの先頭に文字を追加する
(例: 追加したテキストターゲット)
後ろに追加
$('ターゲット').append('追加したいテキスト');ターゲットのテキストの後に文字を追加する
(例: ターゲット追加したテキスト)
前に要素を追加
$('ターゲット').before('<p>追加したい要素</p>');ターゲットの前に要素(HTMLタグ)を追加する
(例:
追加した要素
ターゲット)
後ろに要素を追加
$('ターゲット').after('<p>追加したい要素</p>');ターゲットの後ろに要素(HTMLタグ)を追加する
(例:
ターゲット
追加した要素)
要素で囲む
$('ターゲット').wrap('<div></div>');ターゲットを要素で囲む(親要素を付与する)
親要素を消す
$('ターゲット').unwrap('div');ターゲットから親要素を取り除く
まとめて囲う
$('クラス').wrapAll('<div></div>');親要素を付与して複数要素をまとめる
(例は該当するクラスを持つ要素をまとめて div に格納する)
コンテンツに要素をつける
$('ターゲット').wrapInner('<p></p>');ターゲットの持つコンテンツに要素を付与する
(例: <div><p>ターゲット</p></div>
