JavaScript情報交換所(プログラミング既習者専用） [無断転載禁止]©2ch.net (766ﾚｽ)
上下前次1-新
抽出解除 必死ﾁｪｯｶｰ(本家) (べ) 自ID ﾚｽ栞 あぼーん
ﾘﾛｰﾄﾞ規制です｡10分ほどで解除するので､他のﾌﾞﾗｳｻﾞへ避難してください｡
609(1): デフォルトの名無しさん [sage] 2020/07/23(木)21:58 ID:k24nyzXR(1/21)
>>606
> (なおjQueryでもbubble主体で書くことは可能ではあるが、それをやるとjQueryの意味がほぼ無くなるので普通はやってないと思う）
イベントのキャプチャフェーズとバブリングフェーズの話をしてるなら
jQueryはバブリングフェーズしか対応してません
jQueryの意味がなくなる？なぜですか？
そもそもIE8以前がキャプチャフェーズに対応してないので
それ以前からあるjQueryでは実装が不可能です。
（jQuery 4.0では実装されるらしい）
間違ったことを書かないでください
610: デフォルトの名無しさん [sage] 2020/07/23(木)22:00 ID:k24nyzXR(2/21)
>>607
> 現実的には使いにくく、俺はイベントハンドラを集めたオブジェクト（その中に共通関数も入っている）をthisとしてcallし直して、
> イベントハンドラ内ではthis.my_sub_function()で共通関数を呼べるようにしている。
> この場合、thisは単なるオブジェクトなので、継承出来るのがいい。(共通関数の共通関数を__proto__側に追い出せる）
やめましょう。無関係のイベントハンドラをまとめることは
単一責任の原則に違反しています。
611: デフォルトの名無しさん [sage] 2020/07/23(木)22:01 ID:k24nyzXR(3/21)
>>607
> イベントハンドラ内でthisをe.currentTargetとして利用することはガチのサイトではほぼ無い、ということ。
いいえ。殆どがthisを使っています。e.currentTargetは冗長なだけです。
612(1): デフォルトの名無しさん [sage] 2020/07/23(木)22:41 ID:k24nyzXR(4/21)
>>606
> DOM APIのthisがe.currentTargetを指すのはそもそもJava用の仕様、
> つまりJavaでもクライアントスクリプトを書けるようにする為の仕様らしい。（とここ5chで聞いた）
逆です。Javaではe.currentTargetを使い、thisは使えません。
（当時の）Javaでは言語仕様上の制限でイベントハンドラとして関数を使用することはできません。
イベントハンドラはオブジェクトである必要があります。
イベントハンドラ自体がオブジェクトであるため、thisはイベントハンドラオブジェクトになります。
そのためJavaでthisは使えません。
また昔のIEはaddEventListnerがなくattachEventを使いますが。
attachEventの場合thisはwindowでありe.currentTargetではありません。
つまり初期のIEのDOM APIはもちろんJavaでも使えますが
event.srcElement（e.currentTarget相当）しか実装されてないということです。
thisがe.currentTargetなのはJavaScriptのために作られた仕様です。
613(2): デフォルトの名無しさん [sage] 2020/07/23(木)22:44 ID:k24nyzXR(5/21)
>>606
> JavaScriptにおいてはe.targetを全面的に使うのが正しい。
いいえ。e.targetは廃止されてます。
https://developer.mozilla.org/ja/docs/Web/API/Event/target
わざと正反対のことを書いてるんですかね？
615: デフォルトの名無しさん [sage] 2020/07/23(木)22:49 ID:k24nyzXR(6/21)
>>614
> バブル主体で書くとそもそもqueryしないから
そういう意味ですか？
意味不明なので他のわかりやすいサイトを
探し出してください
616: デフォルトの名無しさん [sage] 2020/07/23(木)22:49 ID:k24nyzXR(7/21)
×そういう意味ですか？
○どういう意味ですか？
617: デフォルトの名無しさん [sage] 2020/07/23(木)22:50 ID:k24nyzXR(8/21)
＞それは君がbubbleを使ってないから。
bubbleを使うとやらのコードを書いてください
618: デフォルトの名無しさん [sage] 2020/07/23(木)22:53 ID:k24nyzXR(9/21)
Description: The current DOM element within the event 「bubbling」 phase.
https://api.jquery.com/event.currentTarget/
620: デフォルトの名無しさん [sage] 2020/07/23(木)22:54 ID:k24nyzXR(10/21)
jQuery event.currentTarget
日本語訳 説明：イベントバブリングフェーズ内の現在のDOM要素。
621(1): デフォルトの名無しさん [sage] 2020/07/23(木)22:55 ID:k24nyzXR(11/21)
>>619
だからjQueryはバブルしかサポートしてないし、
jQueryのevent.currentTargetは（DOM APIと同じで）
イベントバブリングフェーズ内の現在のDOM要素。
622(4): デフォルトの名無しさん [sage] 2020/07/23(木)22:57 ID:k24nyzXR(12/21)
>>619
> そしてbubbleを使わずに一々全Elementにイベントを付けていくのは完全に旧式であって、
jQueryでは全Elementにイベントハンドラを使えずに、
ocumentエレメントにイベントハンドラを付ける場合このように書きます。
$(document).on('click', 'a', function() {
$(this).css("background": "red");
});
知ってましたか？ｗ
623(5): デフォルトの名無しさん [sage] 2020/07/23(木)23:16 ID:k24nyzXR(13/21)
https://jsfiddle.net/m8q15376/
例えばこの2つのコードはイベントハンドラをつけてるところは違いますが
同じよう動作をします。thisが使えない？何の話でしょうかねｗ
$("#id1").on('click', 'a', function() {
$(this).css("background", "red");
});
$("#id2 a").on('click', function() {
$(this).css("background", "red");
});
625(1): デフォルトの名無しさん [sage] 2020/07/23(木)23:21 ID:k24nyzXR(14/21)
もうわかりましたね？ ID:QHkNbR5l はイベントデリゲーションのことを
バブルなんて言ってるわけです（笑）
https://developer.mozilla.org/ja/docs/Web/API/Event/target
> event.target プロパティは、イベントデリゲーションを実装するために使用できます。
所詮オレオレ用語を使うレベルなんですよ
627: デフォルトの名無しさん [sage] 2020/07/23(木)23:22 ID:k24nyzXR(15/21)
>>624
> 知ってる。そしてそれだとjQueryを使う意味が無い＝生のDOMAPIでも同様に書けるだろ
では生のDOM APIを使ってe.targetなしで書いてみてください。
できますか？ jQueryはe.targetなしで書きました。
628: デフォルトの名無しさん [sage] 2020/07/23(木)23:23 ID:k24nyzXR(16/21)
>>626
> だからそれ明らかにイベントバブル使ってないじゃん。]
最初に言ったよね？イベントバブル使うコードかけって
なんでお前かけないの？
629: デフォルトの名無しさん [sage] 2020/07/23(木)23:24 ID:k24nyzXR(17/21)
>>626
1. jQueryのコードはイベントバブルしか使わない（使えない）
2. >>622のコードはe.targetを使ってない
ここまではいいですかねぇ（呆れ）
631(1): デフォルトの名無しさん [sage] 2020/07/23(木)23:28 ID:k24nyzXR(18/21)
> イベントバブルを最初に実装したフレームワークはHTMLで、
笑うしかないわw HTMLがフレームワークとかｗ
632(1): デフォルトの名無しさん [sage] 2020/07/23(木)23:29 ID:k24nyzXR(19/21)
> イベントデリゲーションってのは確かにそこにあるが、初めて聞いたが。
はい、初めて聞くレベル
634: デフォルトの名無しさん [sage] 2020/07/23(木)23:30 ID:k24nyzXR(20/21)
> e.targetについては、
> 複数の要素に同じイベントハンドラを割り当てて、どれかでイベントがあったときに何かさせたいような場合、e.target はとてつもなく有用なものです。
↓このコードが複数の要素に同じイベントハンドラを割り当てて、どれかでイベントがあったときに何かさせているコード
https://jsfiddle.net/m8q15376/
$("#id1").on('click', 'a', function() {
$(this).css("background", "red");
});
635(1): デフォルトの名無しさん [sage] 2020/07/23(木)23:56 ID:k24nyzXR(21/21)
まとめ
こいつはイベントデリゲーション（複数の要素に同じイベントハンドラを割り当てるコード）を
jQueryで書いているコードを見たことがない、もしくは見たことあっても気づかないで
jQueryでもDOM APIと同じように書くしかないはずだ！だからjQueryを使う意味がない！と考えていたようだが
そのイベントデリゲーションこそjQueryでシンプルに書けるコードの一つだったという話です。
上下前次1-新書関写板覧索設栞歴
ｽﾚ情報 赤ﾚｽ抽出 画像ﾚｽ抽出 歴の未読ｽﾚ AAｻﾑﾈｲﾙ
ぬこの手 ぬこTOP 0.025s