元スレ+ JavaScript & jQuery 質問用スレッド vol.7 +
JavaScript覧 / PC版 / みんなの評価 :
901 = :
サンプルもなにもそのままじゃん
いっつも？
902 = :
他の処理→$('#hoge')の処理→$('#hoge')の処理すればいいだけ
904 = :
>>902
それができないケース今までに経験したことない？
処理というか値参照含めて
905 = :
経験したことがあったとしても、原則論は変わらんやろ
別に並行宇宙の隅々にまでそんな可能性は落ちとらん言ってるわけやないんやから
906 = :
>> 904
> それができないケース今までに経験したことない？
それを書けって言ってるのに、
これがサンプルも何もそのまんまじゃんって言ったんだから
このサンプルは順番入れ替えられるで終わりだろ
907 = :
>>904
> それができないケース今までに経験したことない？
ありませーんｗ あんたの書き方が悪いだけでーす
908 = :
$('#hoge').val() を100回加算は？
909 = :
>>907
プログラム未経験？ｗ
911 = :
答えてくれないので、最初のval()で1が入っていたとして
1+1 → 2
2 + 2 → 4
4 + 4 → 8
を100回繰り返すことにしたよｗ
$('#hoge').val(function() {
return _.range(100).reduce(v => v + v, parseInt(this.value))
});
// 1.2676506002282294e+30
http://jsfiddle.net/636wr4mu/
で、本題はなんだっけ？
$('#hoge')を一回で済ませる？ 済ませたが？
何ができないの？
>>909
プログラム未経験？ｗｗｗ
はぁ～、結局ちゃんとした書き方をしらねーだけじゃねーか。
はぁ～、本当に情けない。
912 = :
更新 一行に修正した
http://jsfiddle.net/636wr4mu/1/
jQueryはforでループをぐるぐる処理する書き方よりも
こういう宣言的な書き方のほうが似合ってるよね。
913 = :
コード載せるの忘れた
$('#hoge').val((i, value) => _.range(100).reduce(v => v + v, parseInt(value)))
914 = :
面白い応用例
http://jsfiddle.net/636wr4mu/4/
CSSはセレクタに適合する要素にたいして
同じスタイルを適用するのと同じように
jQueryはセレクタに適合する要素にたいして
同じ処理を適用することができる
なので、#hogeみたいに単独のIDではなく
.hogeみたいなクラスにすると、CSSで
一行ですべての要素に色を付けるのと同様
jQueryで一行で全ての要素に処理を適用できる
<input class="hoge" value="1"><br>
<input class="hoge" value="2"><br>
<input class="hoge" value="3"><br>
.hoge { color: green }
$('.hoge').val((i, value) => _.range(100).reduce(v => v + v, value|0))
915 = :
アローなしでは？
917 = :
ほれ、単に function と return と {} が増えるなーぐらいの話でしかないよ
$('.hoge').val(function(i, value) {
return _.range(100).reduce(function(v) { return v + v; }, value|0);
});
918 = :
>$('#hoge')の処理→他の処理→$('#hoge')の処理
ではないわな
919 = :
>>917
世間一般こういう書き方してるのでしょうか？
ただfor回したほうがわかりやすくないですか？
920 = :
>>918
わざとか？
>$('#hoge')の処理→他の処理→$('#hoge')の処理
の例を出せと言ったら
>>908が
> $('#hoge').val() を100回加算は？
って言ったんだよ。
>>908は$('#hoge').val() を100回加算を
$('#hoge')の処理→他の処理→$('#hoge')の処理
の例として出したから、俺はそれを並び替えて
$('#hoge')の処理（の中に他の処理を含める）
として書き直してやったんだよ。
「ではないな」と言われても知らんがなｗ
921 = :
>>919
forで回したいなら回せばいいじゃん？
俺は変数の値を変えるのではなく宣言的に書くのが
優れているという世間一般の認識どおりに書いただけの話
例のconstで十分って話の続きよ
ほらよ。変数の値を変える方に書き換えてあげるよ。
$('.hoge').val(function(i, value) {
let v = parseInt(value);
for (let i = 0; i < 100; i++) { v += v; }
return v;
});
それが今回の$('.hoge')は一回で十分だろって話に
何の関係があるのか知らんが
922 = :
>>919
たかが足し算するのにそんな大げさに書くのは変人の類。
１回変数に入れるだけで、キャッシュする必要ないよは言い過ぎ。
また作り方が悪いとは言えない（多いだから全否定ではないのでそこはＯＫ）。
ちなみに>>894はワシではない。
923 = :
な？これで証明できただろ？
ちゃんとしたjQueryの書き方で書いていれば、
変数に入れておきたいというシチュエーションがないってことが。
毎回取得すればいいし、取得した方が動的にページが変わっても対応できるし
結局、jQueryオブジェクトを変数に入れて置くのは作り方が悪いってことなんだよ。
924 = :
ふむ。なーんとなく>>908が>>899の言う$('#hoge')の処理が二回出て来る例で
>>913とかがそれを論破するコードであることに気づいていない人がいそうだ。
解説したほうが良いかね？
925 = :
template要素に最初にイベント付加しといて
importNodeでイベントもクローンしたいのですができますか？
http://jsfiddle.net/p1bnwqxz/
これですんなり行くと思ったら無理でした
なのでtemplateを諦めてしまったのです
http://jsfiddle.net/p1bnwqxz/1/
926 = :
>>925
動的に生成される要素に対して
イベントを予めつけるのは無理だよ
こういうのは、document（もしくは#test）に対してイベントを付けておけばいい
といってもjQueryなら簡単。単に引数を変えるだけ
まずは最小限の修正
http://jsfiddle.net/p1bnwqxz/2/
そして余計なものを削った
http://jsfiddle.net/p1bnwqxz/4/
応用（書き方のバリエーション）
http://jsfiddle.net/p1bnwqxz/5/
927 = :
ん？ jQueryのcloneメソッドにはイベントごとクローンするオプションがあるのか？
でもtemplate要素と組み合わせるとうまくいかない？
興味がある人は試してみるのも良いかも
俺としては親要素にたいしてイベントつける方をすすめるけどね
イベントハンドラを一つしか作らなくていいから軽いはず
928 = :
あぁ、それが
> これですんなり行くと思ったら無理でした
> なのでtemplateを諦めてしまったので
の方か
929 = :
>>926,927
＞動的に生成される要素に対して
＞親要素にたいして
なるほど
今まではイベントは、アクションのある要素一つ一つに（指定して）付加しないと発火しないものだと思っていました
（なので、後からappendされた要素になぜイベントが適用されてるんだろう・・と一瞬意味がわかりませんでした）
CSSみたいな感覚？で良かったのですね
今までもやもやしてた部分がスッキリしました
ありがとうございます
930 = :
>>923
$('#hoge')の「処理を」というより「値を」ということでは
931 = :
>>930
何が言いたいかわからない。
いまの話題は$('#hoge')を$hogeに入れておく必要はないよって話
DOM要素が変化する可能性を考えると、最新のDOMに追従するために
その都度取得した方がいいし、それによる速度低下も殆ど無い
なにより大抵の場合はイベントハンドラ呼び出しごとに1回の取得ですむ
932 = :
>>931
ケース・バイ・ケース
それはキミのローカルルールだろｗ
933 = :
だから入れておいた方がいいケースってのを
聞いてるんだがｗ
934 = :
入れておいた方がいいというか、入れない方が自然で誰もが読める場合はすでに出てる
最新のDOMに追従はその通りだが変数使わないで無理に不自然にする必要もない
それと負けず嫌いほど論破という言葉を使うのはどの板も同じだな
935 = :
入れておいた方がいいケース、早く出してね
936 = :
お前らって本当にローカルだなｗ
937 = :
ローカルとかそういう問題じゃなくて
どういう時に変数に入れて2回以上使うかの
コードを書けばいいだけ
938 = :
他スレにもいたがコード書いて一生懸命なのはありがたいがかなり特殊だよな。
941 = :
でもWeb Componentsサポートの機能も入ってるよｗ
http://github.com/jquery/jquery/wiki/Roadmap
Improve support for "Web Components" features like ShadowRoot
942 = :
jQuery自体が仮想DOM的な要素も持っているから相容れないよね
943 = :
>>942
知らない話に無理に参加する必要はないぞｗ
jQueryと仮想DOMは全く関係ないし
Shadow DOMの間違いだとしてもjQueryとは関係ない
jQuery UIの話だとしても、将来jQuery UIをShadow DOMで
実装するというアイデアは誰だって思いつくだろう
944 = :
>>933
var str = $('#manko').text();
$('.chinko').each(function(){
$(this).css('color', $(this).text() == str ? red : blue);
});
945 = :
↑ jQueryオブジェクトを変数に入れる必要がない例
（このようにthisを使えば良いんやで）
946 = :
>>944
redとblueが定義されてない
947 = :
>>944
長い
var str = $('#manko').text();
$('.chinko').css('color', function() {
return $(this).text() == str ? "red" : "blue";
});
948 = :
つーか、この話題。質問者の次のレスで解決してる話なんかｗ
892 名前：Name_Not_Found[sage] 投稿日：2017/11/03(金) 04:58:11.05 ID:???
イベント内であるノードを操作するとき、
その度に取得したらいいのかそれとも変数に格納しておくのが良いのか
よくわからないのでどちらがいいのか教えてください
$hoge=$('#hoge');
$('button#fuga').click(function(){ $hoge.text('操作'); });
//がいいのか、それとも
$('button#fuga').click(function(){ $('#hoge').text('操作') });
//がいいのか
//双方メリットデメリットがあるのか、など
893 名前：Name_Not_Found[sage] 投稿日：2017/11/03(金) 08:47:53.21 ID:???
せっかくjQuery使ってるのにわざわざキャッシュとかする必要ないよ
できるだけ簡潔に書けばいい
949 = :
$('#fuga').on('click', function(){ $('#hoge').text('操作'); });
IDセレクタに要素名は不要
var $manko = $('#manko');
$('.chinko').each(function(){
if ($manko.text() == $(this).text()) { testが等しい場合の処理 }
else if ($manko.attr('id') == $(this).text()) { idが等しい場合の処理 }
});
こういうケースはキャッシュするべき
若干でも明らかに速度が違ってくる
950 = :
jQueryの時点で速度も糞もあるかｗ
前へ 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 次へ
/ 要望・削除依頼は掲示板へ / 管理情報はtwitterで / 
JavaScript一覧へ類似してるかもしれないスレッド
- + JavaScript & jQuery 質問用スレッド vol.7 + (701) - [100%] - 2022/12/19 17:15
- + JavaScript & jQuery 質問用スレッド vol.8 + (1001) - [98%] - 2019/2/9 14:00
- + JavaScript & jQuery 質問用スレッド vol.6 + (980) - [98%] - 2016/11/20 14:31
- + JavaScript & jQuery 質問用スレッド vol.5 + (993) - [98%] - 2016/6/11 14:30
- + JavaScript の質問用スレッド vol.76 + (1001) - [72%] - 2010/3/10 4:02
- + JavaScript の質問用スレッド vol.87 + (1001) - [72%] - 2011/6/21 6:33
- + JavaScript の質問用スレッド vol.78 + (1001) - [72%] - 2010/6/25 3:53
- + JavaScript の質問用スレッド vol.79 + (1001) - [72%] - 2010/9/11 6:50
- + JavaScript の質問用スレッド vol.77 + (1001) - [72%] - 2010/5/8 19:06
- + JavaScript の質問用スレッド vol.97 + (1001) - [72%] - 2012/3/1 3:31
- + JavaScript の質問用スレッド vol.74 + (1001) - [72%] - 2009/12/1 6:08 ○
- + JavaScript の質問用スレッド vol.75 + (1001) - [72%] - 2010/1/23 1:07 ○
トップメニューへ / →のくす牧場書庫について