jQuery API の removeData( list ) は、マッチしたDOM要素に関連付いているデータから、引数「list」に指定したkeyに対応する値を削除するメソッド。
記述方法（構文）
jQuery( セレクター ) . removeData( リスト )
「セレクター」にマッチしたDOM要素に関連付いているデータから、引数「list」に指定した「キー」に対応する値を削除する。
引数
- list / リスト
データから削除したいキーを格納した配列を指定。もしくは、削除したいキーを半角スペース区切りで並べた文字列を指定。
記述例
配列
jQuery( '#sample' ) . removeData( [ 'keyA', 'keyB', 'keyC', ] )
idが「sample」であるDOM要素に関連付いているデータから、キー「keyA～C」に対応する値を削除する。
半角スペース区切りの文字列
jQuery( '#sample' ) . removeData( 'keyA keyB keyC' )
idが「sample」であるDOM要素に関連付いているデータから、キー「keyA～C」に対応する値を削除する。
実装例（サンプル）
- 名前：
- 点数
- 数学：
- 科学：
実装例（サンプル）のソースコード
JavaScript
<script type="text/javascript">
<!--
jQuery( function() {
jQuery( '#jquery-sample-button-tarou' ) . click( function() {
jQuery( '#jquery-sample' ) . data( { name: '太郎', mathematics: 85, science: 70 } )
jQuery( '#jquery-sample-name' ) . text (
jQuery( '#jquery-sample' ) . data( 'name' )
);
jQuery( '#jquery-sample-score-mathematics' ) . text (
jQuery( '#jquery-sample' ) . data( 'mathematics' )
);
jQuery( '#jquery-sample-score-science' ) . text (
jQuery( '#jquery-sample' ) . data( 'science' )
);
} );
jQuery( '#jquery-sample-button-zirou' ) . click( function() {
jQuery( '#jquery-sample' ) . data( { name: '次郎', mathematics: 76, science: 100 } )
jQuery( '#jquery-sample-name' ) . text (
jQuery( '#jquery-sample' ) . data( 'name' )
);
jQuery( '#jquery-sample-score-mathematics' ) . text (
jQuery( '#jquery-sample' ) . data( 'mathematics' )
);
jQuery( '#jquery-sample-score-science' ) . text (
jQuery( '#jquery-sample' ) . data( 'science' )
);
} );
jQuery( '#jquery-sample-button-removeData' ) . click( function() {
jQuery( '#jquery-sample' ) . removeData( [ 'mathematics', 'science' ] );
var $name = jQuery( '#jquery-sample' ) . data( 'name' );
if( !$name ) {
$name = "空っぽ";
}
jQuery( '#jquery-sample-name' ) . text( $name );
var $mathematics = jQuery( '#jquery-sample' ) . data( 'mathematics' );
if( !$mathematics ) {
$mathematics = "空っぽ";
}
jQuery( '#jquery-sample-score-mathematics' ) . text( $mathematics );
var $science = jQuery( '#jquery-sample' ) . data( 'science' );
if( !$science ) {
$science = "空っぽ";
}
jQuery( '#jquery-sample-score-science' ) . text( $science );
} );
} );
// -->
</script>
<!--
jQuery( function() {
jQuery( '#jquery-sample-button-tarou' ) . click( function() {
jQuery( '#jquery-sample' ) . data( { name: '太郎', mathematics: 85, science: 70 } )
jQuery( '#jquery-sample-name' ) . text (
jQuery( '#jquery-sample' ) . data( 'name' )
);
jQuery( '#jquery-sample-score-mathematics' ) . text (
jQuery( '#jquery-sample' ) . data( 'mathematics' )
);
jQuery( '#jquery-sample-score-science' ) . text (
jQuery( '#jquery-sample' ) . data( 'science' )
);
} );
jQuery( '#jquery-sample-button-zirou' ) . click( function() {
jQuery( '#jquery-sample' ) . data( { name: '次郎', mathematics: 76, science: 100 } )
jQuery( '#jquery-sample-name' ) . text (
jQuery( '#jquery-sample' ) . data( 'name' )
);
jQuery( '#jquery-sample-score-mathematics' ) . text (
jQuery( '#jquery-sample' ) . data( 'mathematics' )
);
jQuery( '#jquery-sample-score-science' ) . text (
jQuery( '#jquery-sample' ) . data( 'science' )
);
} );
jQuery( '#jquery-sample-button-removeData' ) . click( function() {
jQuery( '#jquery-sample' ) . removeData( [ 'mathematics', 'science' ] );
var $name = jQuery( '#jquery-sample' ) . data( 'name' );
if( !$name ) {
$name = "空っぽ";
}
jQuery( '#jquery-sample-name' ) . text( $name );
var $mathematics = jQuery( '#jquery-sample' ) . data( 'mathematics' );
if( !$mathematics ) {
$mathematics = "空っぽ";
}
jQuery( '#jquery-sample-score-mathematics' ) . text( $mathematics );
var $science = jQuery( '#jquery-sample' ) . data( 'science' );
if( !$science ) {
$science = "空っぽ";
}
jQuery( '#jquery-sample-score-science' ) . text( $science );
} );
} );
// -->
</script>
CSS
<style>
<!--
#jquery-sample {
color: #333333;
list-style-type: square;
}
-->
</style>
<!--
#jquery-sample {
color: #333333;
list-style-type: square;
}
-->
</style>
HTML
<p>
<button id="jquery-sample-button-tarou">太郎</button>
<button id="jquery-sample-button-zirou">次郎</button>
<button id="jquery-sample-button-removeData">削除</button>
</p>
<ul id="jquery-sample">
<li>名前：<span id="jquery-sample-name"></span></li>
<li>点数
<ul id="jquery-sample-score">
<li>数学：<span id="jquery-sample-score-mathematics"></span></li>
<li>科学：<span id="jquery-sample-score-science"></span></li>
</ul>
</li>
</ul>
<button id="jquery-sample-button-tarou">太郎</button>
<button id="jquery-sample-button-zirou">次郎</button>
<button id="jquery-sample-button-removeData">削除</button>
</p>
<ul id="jquery-sample">
<li>名前：<span id="jquery-sample-name"></span></li>
<li>点数
<ul id="jquery-sample-score">
<li>数学：<span id="jquery-sample-score-mathematics"></span></li>
<li>科学：<span id="jquery-sample-score-science"></span></li>
</ul>
</li>
</ul>