jQuery 質問スレッド vol.8
■ このスレッドは過去ログ倉庫に格納されています
JavaScriptでDOM用ライブラリであるjQueryのスレです。
次スレは>>950が>>2のテンプレ案(本スレで改善案があれば考慮)を元に立ててください
このスレはjQueryやjQuery UIの使い方やjQueryプラグインの作り方を質問するスレです。
jQueryを使って作る側のスレであって、こんなプラグインありませんか？と聞くスレではありません。
そういうのは自分で探してください。
ろくにサポートもされてなさそうな野良プラグインの使用はおすすめしません。
JavaScriptの質問は関連スレで質問して下さい。
■前スレ
jQuery 質問スレッド vol.7
https://mevius.5ch.net/test/read.cgi/hp/1478055094/
■関連スレ
JavaScript の質問用スレッド vol.130
https://mevius.5ch.net/test/read.cgi/hp/1501503056/
ECMAScript デス 6
https://mevius.5ch.net/test/read.cgi/tech/1483332914/
JavaScript ライブラリ総合質問所 vol.5
https://echo.5ch.net/test/read.cgi/hp/1465399470/ >>192
アンカたどれ
これのことだ
145 自分：Name_Not_Found[sage] 投稿日：2018/01/28(日) 21:03:38.80 ID:???
一つの要素にJavaScriptからそんなに多くのクラスを
設定する必要が有ることがそもそも間違ってる
もっとたどるならこれのことだ
140 名前：Name_Not_Found[sage] 投稿日：2018/01/28(日) 10:57:06.54 ID:???
.aaaに動的に付けたclass(bbb ccc ddd・・・)の削除や付け直しを一括でしたく
$('.aaa').removeClass('bbb ccc ddd・・・');
を
$('.aaa').removeClass().addClass('aaa');
とするのはあり?
143 名前：Name_Not_Found[sage] 投稿日：2018/01/28(日) 17:27:37.90 ID:???
>>142
そうなんだけど・・・の管理が面倒で
変更の度にそこも付け加えなくてはならなくて
最初つけるclassは1,2個と少ないので楽かなと $('.aaa').removeClass('bbb ccc ddd・・・');
で一つづつremoveClassするのは大変だからって
$('.aaa').removeClass() してしまうのは
>>142が指摘したとおりの問題が有る
142 名前：Name_Not_Found[sage] 投稿日：2018/01/28(日) 11:50:24.50 ID:???
>>140
それだと静的に付けたclassまで消えちゃうじゃん
> そうなんだけど・・・の管理が面倒で
> 変更の度にそこも付け加えなくてはならなくて
となるのは、classに複数の異なった属性を属性を入れてしまうから
管理が面倒になるほどの自体になる。
そして>>183もその通りのことをやってしまった。
複数の異なった属性を一つのclassに入れてしまうから
classの値がたくさん増えることになり管理が面倒になる >>190
だろっていちいち書くなよ、うざいな
専ブラ使ってないのか？ >>195
5ちゃんねるの使い方の話は、別件だからおいておこうか？ >>194
全然面倒ではないが何か？
こういう案件自体はあるだろ > 全然面倒ではないが何か？
質問者が面倒だって言ってるのに
何を言ってるんだおまえは？ >>176がわからない→例え>>183
やってしまったもなにもないわな
アンカで追えてないのか話が混ざってる気がする >>193それは見てますよ
それのどこが一つのclassになのでしょうか？ >>199
それ俺が書いたんだけど？
質問者が面倒だって言ってるから、
俺がclassに複数の異なった属性を入れるのがいけないと指摘した
異なった属性を混ぜ込まなければclassにそんなに多くのものを入れることはない
「一つの要素にJavaScriptからそんなに多くのクラスを
設定する必要が有ることがそもそも間違ってる」
最初から質問者に対してそう指摘している
で、おまえは誰？何をやった？ >>201
> それのどこが一つのclassになのでしょうか？
一つの要素にclass属性は"一つ"しかありませんよｗ
data-*属性はいくつでも作れますがね >>203
>>194に”複数の異なった属性を一つのclassに入れてしまう”と？
ついでに質問いいすか？
>>188はdataメソッドでなくattrメソッドで変えるということでしょうか？
リセットするときどうするのでしょうか？
もし各data-*ごとに消すならaddＣｌａｓｓとさほど変わらない気がしますが それもだが上に出てたライブラリで勝手に〜はどうするんだろうな
むろんdata-*を否定するわけではないが >>188
>>143で「変更の度にそこも付け加えなくてはならなくて面倒」とある。
>>188でどう解決するのか。
同じく聞きたい。 >>204
>>188はdataメソッドでなくattrメソッドで変えるということでしょうか？
そう。attrメソッドで変える。
そもそもdata-*は別にjQueryのdataメソッドのための属性というわけじゃない
jQueryのdataメソッドが先に作られ、HTML5の仕様としてdata-*が作られた
dataメソッドの初期値としてうまく整合性が取れそうだから統合されたが、
もともと関係ないもので、data-*を属性として使うなら、attrメソッドを使う
> もし各data-*ごとに消すならaddＣｌａｓｓとさほど変わらない気がしますが
値をグループ化できる。複数の値を週類ごとにまとめたものがグループ
classの場合は値を書くしかないから3つのグループがあって、一つのグループごとに
5個の値があれば、最大15個の値を管理する必要が出てくる
data-*を使えば3つでいい（今は数が多くて管理が大変という話だというのを思い出そう）
グループと値として管理できるのがメリット
また値として排他であってもclassだと値の組み合わせが作れてしまう（例えば、class="black white red yellow"）
もちろんこの場合の動きとしては未定義でいいんだが、data-color="black" とかいう使い方なら
他の値が同時に設定されていることを考えなくて済む
>>206
> それもだが上に出てたライブラリで勝手に〜はどうするんだろうな
ライブラリが勝手につけたものは無視すればいい。classという一つの属性を共用して
使っているわけじゃないので、自分以外のことは考えなくて良い
もちろんライブラリでもdata-*を使っていて名前がが被る可能性があるが、
それはclassの値でも一緒の話だし名前の付け方を工夫すればよい >>207
>>143で「変更の度にそこも付け加えなくてはならなくて面倒」とある。
値は増えるが、グループが増えることは少ない
それに加え
グループが増えたとしても、既存のコードには影響が出ない
classをつかっていると、既存のコードが参照しているclassに
自分の知らない値が入ったぞ！ということになり
それに対応するのが大変という話だが
data-*だと、既存のコードが参照してないグループ（data-*属性）が
追加されただけなので、既存のコードとは無関係となる もうちょっと具体的に話をする
classに全部ぶち込むと、スペース区切りで複数の値を入れることになる。
data-*であればそんなことをしなくて単体の値を指定できる。
っていうことは、
let resetValue = {
"data-color": "white",
"data-size": "M",
}
みたいに初期値を書けるってことだよ
これがクラスだと
let resetValue = {
"white": true,
"black": false,
"red": false,
"blue": false,
"m": true,
"l": false,
"s": false,
"ll": false,
// それ以外の知らない値はそのまま変更しない（消してはいけない）
}
としなければいけなくなるということ
そして、色やサイズのパターンが増えたらどうすんの？ということ
ま、無理やりやろうとするなら、classの値に特殊な名前つけルールを作って
そのルールを解釈して操作する関数を作るなんて "無駄なこと" をやればできるがねｗ
whiteとではなくcolor-whiteみたいにプリフィックス付けて全部列挙して color- だと・・・無駄だなｗ ちなみに初期値に設定するのは
$("#id").attr(resetValue)
だけでいいで？ attrはハッシュ値を受け付けるからよ >>208
グループも何も静的1個（または2個）で済む方法がある>>140
>>142のことはスッキリしない人がいるかもしれんだろうが>>141ならそれでいいんじゃね >>141の「ええよ」は、その一つ前のレスの質問者（>>140）へのレスであって
>>142の問題があるけどどうする？に対する「ええよ」じゃないぞ？（時系列注意） というか、 ＞＞142で
> それだと静的に付けたclassまで消えちゃうじゃん
という指摘にたいして
> そうなんだけど・・・の管理が面倒で
> 変更の度にそこも付け加えなくてはならなくて
> 最初つけるclassは1,2個と少ないので楽かなと
って悩んだ挙句の妥協案じゃんｗ
それからもっといい案（data-*）が出てるわけでしょ
ほんと時系列注意なｗ んなこたわかってる
そもそも>>140だって元々>>142の問題を承知で書いてる
だからわざわざaaaを付け直してるんだろ だがdata-*を使ったもっといいやり方には
気づいていなかった >>208
おおまかわかりました、が
>他の値が同時に設定されていることを考えなくて済む
はclassでも同じことではないでしょうか？重複する変な付け方してなければ
.aaa {color:}
.bbb {size:}
とした場合>>210の
>としなければいけなくなる
の関連がよくわかりません >>217
classだとね、<span class="t-sharts red m">
となっている時に、例えばラジオボタンの変更に従って
Tシャツの色とサイズを変更したいって時に
addClass("blue l") だけじゃだめでしょ？
他の値（red m)が残ってしまうでしょ？という話だよ
もちろんこれはバグなんだが、そもそもこうなってしまうのは
classがスペース区切りで複数のクラスを入れるものであるというHTMLの仕様によるもの
data-*だとその縛りがないので単一の値を入れるものとこっちで勝手に仕様を決められる
<span class="t-sharts" data-color="red" data-size="m">
とあるとき、attr({"data-color": "blue", "data-size", "l"}) とするだけでいい
classでやろうとすると >>210みたいな色のリストを持たなければいけない
その他の色やサイズのリストとその初期値をすべて持って置かないといけない >>218
質問者 = 初心者 と仮定すると（この仮定は概ね正しい）
初心者がいいやり方を決められる訳がない いいやり方は上級者が決める
だがいいやり方は、簡単なやり方とは限らない
いいやり方をするには技術が必要な場合があるからだ
（スポーツとかに置き換えればわかるだろう）
いいやり方をやるための技術力が初心者にはなく
いいやり方を選択できないことも有る。
だがこれは、やり方が良いか悪いかの話ではない
初心者が決めたのは良いか悪いかではなく、
いいやり方を自分がやるかどうかを決めただけ >>140の質問を要約すると、
・動的に追加されたclassの削除再追加を一括で行いたいが、
$('.aaa').removeClass().addClass('aaa'); とするやり方は間違っていないでしょうか?
この質問に対して「あり」以外に答えはない >>222
「あり」が間違いなんて誰も言ってない
もっといいやり方があるって話だ
(9) 時にはあなたが望む「答え」だけでなく、「意見」などが寄せられる場合もあります。 >>223
もっといいやり方がありますか？
という質問は見当たらないけどｗ (9) 時にはあなたが望む「答え」だけでなく、「意見」などが寄せられる場合もあります。 ○○なことをしたいのですが、いいやり方はないでしょうか？
この質問に対して「ある」「ない」以外に答えはない その寄せられた「意見」に対して「不評な意見」が出てるんだよｗ どうして「不評な意見」が出るのか？
ズバリこれねｗ >>220
いや、218はここで他の人が言ってたことだが >>219
removeClass()が不要というのはわかるが
他の値（red m)が残っていい場合と、残ってはいけない場合と、その時々による
今回は残ってはいけないとは言ってないが残したくない様子は伺える
<span class="t-sharts" data-color="red" data-size="m" data-material="silk">
の場合結局
attr({"data-color": "blue", "data-size", "l", "data-material". "cotton"})
としないとsilkが残るので同じじゃね？
それとライブラリなど自分でコントロールできないclassも消したい場合
removeClass()のほうが楽に消せるし手っ取り早い 要は静的に付けたclassは変更しないようにしたいということだから
意図する要素にだけ id でも data でも 静的に付けて於けばどうでもいい事
classでやりたいなら個人の勝手
$(el).removeClass().addClass() は単なるメソッドチェーンなんだから否定するのはおかしい
ただの主観に過ぎない 苦しいなぁｗ 頑張ればできると言ってるだけで
やりづらいだけじゃねーか >>219
詳しくありがとう
でもdata-○○○の○○○は持つ必要があるし（たぶん）
>しなければいけなくなる
理由がいまいちピンときません
それとdata-*でtoggleClassしたい場合どうするのでしょうか？ >>234
toggleClass使いたいならclass使えば良いんじゃね？ 上の流れと別件として、読んでで気になったので
>>167の、HTML5違反をして、独自属性をつけるって話？の箇所
data-hogeでなく
HTML <tag hoge=値>
CSS [hoge] {}
jq attr('hoge', '値')
は違反ってことですか？
そのソース（原文）を知りたいです >>238
このタイミングでそういうレスをした意図がわからないが、
一応言っておくと今回の話題ににはそれが使えない
class="a foo" やclass="a bar" とあるとき、 一発で
class="a baz" にすることはできないから HTML で、使えるタグ名・属性名は、決まっているだろ
タグ名の所に、そのタグ内で使える、属性名が書いてあるはず >>241
どういうこと？
理由を書いてないから推測するしかないが
1. data-*属性は使ってはならない
→ 使ってもらうために仕様が存在する
2. CSSは属性でスタイルを適用してはいない
→ 適用していいから属性セレクタが存在する
3. data-*属性は値を入れるだけ。CSSの属性セレクタの対象としてはいけない
→ そんなことはどこにも書いてない
4. data-*属性はJavaScriptから読み書きしてはいけない
→ JavaScriptから使わないで何に使うの？CSS用途だけっていいたいの？
5. jQueryではdata-*属性ははdataから使わなければいけない
→ DOM APIのgetAttributesつかってOKなんだから同等のjQueryのattrもOK >>242
data属性（カスタム属性）を使うのはその人の勝手
classで用が足せることで本人がそうしたいならその人の勝手
何も間違ってはいないだろ？ >>242
//css
div[data-hoge="before"]{ background-color: gray; }
div[data-hoge="after"]{ background-color: orange; }
//html
<div data-hoge="before">あいうえお</div>
<input type="button" id="btn" value="cosole" />
//js
$('#btn').on('click', function () {
console.log("静的な値をdata('hoge')で取得: ", $('div').data('hoge'));
console.log("動的に値をattr('data-hoge', 'after')に変更する");
$('div').attr("data-hoge", "after");
console.log("動的に変更した値をdata('hoge')で取得: ", $('div').data('hoge'));
console.log("動的に変更した値をattr('data-hoge')で取得: ", $('div').attr('data-hoge'));
});
data()で参照するとキャッシュされた値を出してくるので動的に変更する場合は注意が必要
attr('data-*')で参照すれば問題はないけどね htmlはdata-*で、jqならattrだけでいいんだろ？>>208が言うには $(el).attr('style', 'color: red; background-color: black;');
なんて面倒なことやらないだろ？
$(el).css({'color': 'red', 'background-color': 'black'});
こうするだろ？
何のためにjQuery使ってんの？ってこと >>247
それ好きにすりゃいいレベルの例じゃね？
こんなんまでこっちはまちがいーこっちにしろーとか押し付けられんの？ｗ https://w3techs.com/technologies/overview/javascript_library/all
w3techsによると2017年1月の時点で71.9%のサイトが
JavaScriptのライブラリとしてjQueryを使用していることが判明したが
それから1年たった2018年1月現在、73.2%に1.4%も増えていることが判明した。
またAngularは0.5%、だがReactが伸びてきており0.5%
とAngularを逆転したことがわかる
だがjQueryには大幅なさをつけられており取って代わるのは
いつになるのか動向が注目される >>245
> なにそのくそ仕様誰得なの？
もともとdata-*属性なんてなかった
jQueryのdataの方が先に作られた
jQueryのdataはdata-*属性を書き換えるものじゃない。
メモリの中に要素に関連づいたデータを持たせるためのもの
だからdata-*属性ではもたせられないようなオブジェクトでも持たせられる
data-*は属性はjQueryのdataの初期値としても使われるってだけの話
そしてdata-*属性は、属性なのだからattrメソッドで操作すれば良い >>247
> 何のためにjQuery使ってんの？ってこと
jQueryオブジェクトのためだよ
別にdataメソッドのためじゃない >>247
> $(el).attr('style', 'color: red; background-color: black;');
> なんて面倒なことやらないだろ？
> $(el).css({'color': 'red', 'background-color': 'black'});
> こうするだろ？
面倒くさい以前に意味が違ってる。
前者はstyle属性まるまる入れ替え。値を文字列としてそのまま使う
後者はJavaScriptからみたstyleプロパティの値。
既存のスタイルを残して、指定したものだけ置き換えるだけ
例えばこういうHTMLがあって
<span id="id" style="color: #000">red</span>
attrで取得したときは 'color: #000' が返ってくるが
cssメソッドだとcolorの値は 'rgb(0, 0, 0)' となる。
attrとcssは本来は目的によって使い分けるもの
ただstyleの場合、属性として読み書きすることが少ないってだけ >>251
大変勉強になりました。くそ仕様とか言ってごめんなさいm(_ _)m >>253
>>247はそんなことを言ってるんじゃないだろ？
$(el).css('color', 'red');
$(el).hover(
function(){ $(this).attr('style', 'color: blue;'); },
function(){ $(this).attr('style', 'color: red;');}
);
なんてやらないだろ？ってことだろ >>255
だって、それだとstyleについているかも知れない
color以外のものまで変わってしまうじゃん
そういう将来的に不具合の元になるような
ことはやらないよ。それが>>253に書いて有ることだよ >>256
attr()は単なる文字列操作
css()はハッシュ関数で値を操作できる
どちらが有利かということだろ >>257
違う
attr()はその名の通り要素の属性値を変更するもの
DOM APIで言えばsetAttribute/getAttribute相当のもの
それに対してcss()は、要素の属性値ではなくDOMのstyleプロパティの値を読み書きしている
style属性とstyleプロパティは、そのまま一対一で対応しているわけではない
例えば <span style="background: border-box">と属性で指定した時、
element.style.backgroundColor は initialとなる。属性には何も書いていないのに設定される
さらにcss()による読み込みは単純にstyleプロパティを読み込むだけじゃなく
window.getComputedStyle() を使って最終的なスタイル情報を取得している。
具体的に言うと span { color: red } 、<span style="background-color: blue">
とあった時、attrでは"background-color: blue"としかわからずcolorがredであることは分からないが、
css()ではcolorがred（正確にはChromeではrgb(255,0,0)）ということがわかる
またcss()による設定もDOM API的にはelement.style.color = 'red' のような形で実行される
それが最終的に要素の属性に反映されるのだろうがそれはブラウザがやっていることで、どういう属性になるかは不明
例えば .css({borderTop: '1px', borderBottom: '1px', borderLeft: '1px', borderRight: '1px'}) とすると
style="border-width: 1px; border-style: initial; border-color: initial;" となった（Chromeの場合）
またcss()は一部のプロパティに対してはベンダープレフィックスを自動的に追加する機能も持っている
まとめるとattr()は要素の属性をそのまま読み書きするもので、
css()は、読み込みはDOMが解釈した要素の（実際の）スタイルを読み書きし
要素の属性をそのまま読み込んだり反映したりしているわけではない
要素の属性をそのまま変えたいときはattr(), DOMのstyleプロパティとして変えたいときはcss()
使う目的が違っている >>251
>data-*属性ではもたせられないようなオブジェクト
とは例えば何でしょうか？
{'plice': '100', 'size': 'L'} のようなオブジェクトならattrメソッドで取得設定できるが関数とかかな？ >>258
ハッシュ(値) → 値
属性(名称) → 文字列
これだけのこと >>259
それ、もたせられないよ。
どの要素にも有るグローバル属性のtitleを使って
$('#id').attr('title', {'plice': '100', 'size': 'L'} );
console.log($('#id').attr('title'));
これで試してみ、 [object Object] という文字列になってしまう
JavaScriptのオブジェクトは、文字列ではないので属性値として使えないからね
（正確には強制的にtoString()が呼び出され文字列に変換してしまう） >>260
>>258で反論してることを一切無視して
話を戻そうとしても無駄ｗ
お前が言ったそれが間違っていることは>>258に書いた。
それに対して無視すること自体が
お前が間違ってることをお前自身で認めたようなもんだよｗ >>261
なんで変えてるのでしょうか
そりゃtitleには入れられないでしょうからそれならこれで
$('#id').attr({title,: 'hoge', target: '_blank'}); ようは
$(el).attr('style', 'color: red; background-color: black;');
なんてしないし
$(el).css({'color': 'red', 'background-color': 'black'});
は更に（最終的によほどでないと）しないし、style持ち出すのは話別なんじゃないの、と >>263
> $('#id').attr({title,: 'hoge', target: '_blank'});
それは、title属性にhogeという文字列を入れる
target属性に_blankという文字列を入れるという意味で
入れてるのは文字列になってる
俺は属性にオブジェクト入れられないって言ってるの
少しは頭使ったら？ それ言ったらこれもだから？だな
>入れてるのは文字列になってる
>俺は属性にオブジェクト入れられない つーか、やってみればわかるのにな
priceをpliceと書き間違えるようなやつじゃ無理かｗ
var hash = {price: 100, size: "L"};
$('#id').data('value', hash);
console.log($('#id').data('value')); // => {price: 100, size: "L"}
$('#id').attr('data-value', hash );
console.log($('#id').attr('data-value')); => [object Object]
HTML属性用のattrだと文字列化されるからハッシュを入れることはできない
↓はおまけ。attrだと文字列化されるから数値を入れても文字列に変えられてしまう
$('#id').data(hash);
console.log(typeof $('#id').data('price')); => number
$('#id').attr(hash); // data-を付けずに、price属性、size属性を作ってるからHTML5的には違反
console.log(typeof $('#id').attr('price')); => string >>268
attrでは属性にオブジェクトは入れられないよ
>>269で証明済み でそのdata-*やら属性やらが「classよりいい」と関係してるのかね？
toggleClassや他のclassの削除はスルーなんかな それはJSONを使ってオブジェクトを文字列にすればって意味なので
属性にオブジェクトを入れてることにはならない
加えてJSON文字列に文字列化（シリアライズ）できないものや
情報が失われてしまうものがオブジェクトに
含まれている場合にもやっぱり対応できない
例えば関数とか日付型とかDOM要素とか。
JSONを拡張して頑張れば、少しはましになるかもしれないけど
DOM要素のシリアライズとかまず無理だろうね >>272
> でそのdata-*やら属性やらが「classよりいい」と関係してるのかね？
誤解されるような書き方をするな。わざとか？
> toggleClassや他のclassの削除はスルーなんかな
すでに回答済みだったはずだが？
もう一回書いてやると、
<span class="button color-white size-M">
みたいな書き方をしていて、colorは全12色みたいにもっと色があって
sizeにもS, M, L, LL みたいに複数サイズがあったとする
これをclassを操作して
<span class="button color-red size-l">
のように変えるのは大変。コード側に全ての色を定義して一旦全部
removeClassするか、全てのクラス値を列挙してプリフィックスで見分けるようなコードが必要になる
そういう使い方の場合、data-*属性のほうが、classを使うより良いという話
<span class="button" data-color="white" data-size="M"> を
<span class="button" data-color="red" data-size="L"> に書き換えるならば
$(…).attr({"data-color": "red", "data-size": "L"}) これだけで終わり
こういう話が先にあって、その流れでdata-*やら属性やらが「classよりいい」と言ってる propっていう関数もなかったっけ？
あれはどういうときに使うべき？
使い分けの方針を教えてください。 >少しは頭使ったら？
>priceをpliceと書き間違えるようなやつじゃ無理かｗ
こういう余計なこと書かなきゃいいのに
それで嫌われてるんだろうな
あ、自分で部下に頼れると自慢してた人かな？ｗ >>261
$('#hoge').attr({'data-price': '100', 'data-size': 'L'});
alert($('#hoge').attr('data-price'));
「1つの属性に」オブジェクトを入れられないということでいいですよね
>>265
入れられないというか同時設定できるだけということでいいですよね
http://semooh.jp/jquery/api/attributes/attr/properties/ >>278
> 「1つの属性に」オブジェクトを入れられないということでいいですよね
最初からそう言ってる。属性は文字列しか受け付けられないから
オブジェクトを入れようとしても文字列化される
data()メソッドはもともと要素に紐付いたデータを保存するための仕組みで
オブジェクト等自由に入れることができる。
data()メソッドはdata-*属性と無関係・・・と言いたいところだが
data()メソッドの初期値として利用される。だけどそれだけ。
基本的にはdata()メソッドはdata-*属性を読み書きするものじゃない
> 入れられないというか同時設定できるだけということでいいですよね
複数の属性に同時設定できるという機能を、属性にオブジェクトを代入できると
勘違いしてしまったかわいそうな人がいるという話。
何も言うが属性にはオブジェクト入れられない。入れられるのは文字列だけ。
だからattr()メソッドを使って複数の属性に値を入れようとしても、
入れられるのは文字列だけ。値がオブジェクトだと当然設定することはできない。
つまり
$('#hoge').attr({'data-price': {yen: 100, doller: 1.2}, 'data-size': 'L'});
みたいに、属性の値がオブジェクトになっていれば当然入れることはできない なるほど、attrで設定できるのは文字列だけってことだな >>262
<el data-*= 'value'>
$(el).data('value')
この値の扱いの違い例えてを言ってやって上げてるのに
おまえのオツムでは理解できないみたいだね <el data-*= 'value'> ってなんだ？
まさか * がいろんな文字を意味するってことすら
分かってないのか？ ちょっとかわいそうなんで>>281に教えてあげると
$(el).data('value') で（あくまで初期値としてだが）
読み取るのはdata-value属性
data-*属性ではない。
data-valueという属性の名前になるんだよ >>279
>>259=>>278ですがどうも
それまでの他の書き込みに惑わされました
pliceは指摘ありがと（きついけど） 結論としては、attrメソッドは属性に文字列を設定するものだから
当然オブジェクト入れられない、入れようとしても文字列化されるので
実質意味がない。
それに対してdataメソッドは内部的に要素に関連したデータを
持たせる物。だから文字列以外のオブジェクトをもたせることができる
同じdataで惑わされているようだが、attr(data-*)とdata(*)は
本質的には別物 pliceといえばspliceとsliceでいつも混乱します。どうやって覚えたらいいですか？そもそもスライスは分かるけどspliceってどういう意味ですか？
APIにマイナーな英単語使うなや糞メリケンファック >>288
わかってるお前が解説しろ
本当に分かってないのはお前だろうからさ >>286
>>279の
>$('#hoge').attr({'data-price': {yen: 100, doller: 1.2}, 'data-size': 'L'});
>みたいに、属性の値がオブジェクトになっていれば当然入れることはできない
は（私は最初から）ｏｋですが、とすると
>>208の
>例えば、class="black white red yellow"
なんてことはせず、するなら例えば
class="black m cotton"
である場合、208のグループ化にメリットありますか？ >>291
自分で調べてなかったの？
attrはHTMLの属性を読み書きするもの
propはHTMLの属性ではなくDOMのプロパティを読み書きするもの
DOMのプロパティを読み書きした結果、属性に反映されるかも知れないが
それはブラウザが勝手にやっていること
なので例えばchecked属性が空の時でも、attrで読み取るとundefiendであるが
DOMプロパティ的にはfalseなのでpropを使うとfalseになる
参照先がHTMLの属性かDOMのプロパティかの違いだよ
その点でattr()メソッドとcss()メソッドの関係と似ているね。 ■ このスレッドは過去ログ倉庫に格納されています
