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