のくす牧場
コンテンツ
牧場内検索
カウンタ
総計:127,062,934人
頁
昨日:no data人
頁
今日:人
頁
最近の注目
人気の最安値情報

    元スレjQuery 質問スレッド vol.8

    JavaScript覧 / PC版 /
    スレッド評価: スレッド評価について
    みんなの評価 :
    タグ : 追加: タグについて ※前スレ・次スレは、スレ番号だけ登録。駄スレにはタグつけず、スレ評価を。荒らしタグにはタグで対抗せず、タグ減点を。
    ←前へ 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 次へ→ / 要望・削除依頼は掲示板へ / 管理情報はtwitterで
    801 = :

    >>799
    > は、難解すぎて、訳がわからない
    縦横量対応 + jQueryプラグイン化してあるからねｗ

    短いのであれば、こっちにあった（少しだけ変更してみた）
    コードの説明はリンク先へ
    http://toro.2ch. sc/test/read.cgi/hp/1452081417/732

    $('td').attr('colspan', function() {
    　return $(this).text() === $(this).prev().text() ? null : 1;
    }).filter('[colspan]').attr('colspan', function() {
    　return $(this).nextUntil('[colspan]').length + 1;
    }).end().remove(':not([colspan])');

    802 = :

    そういや >>789は更に最初からcolspanがある場合にも対応していたはず

    803 = :

    色々と参考コードをありがとうございます
    799さんのコードは理解が難しかったですが、改造案件ではこういうのをワンサカ見るんだろうなと思うので理解できるよう努力したいと思います

    804 = :

    何度も同じjQueryオブジェクトを使う時には
    今でも一旦変数に代入した方がいいのでしょうか？
    $document = $(document)
    のように。
    パフォーマンスから言えば代入した方がいいはずですが、
    もう気にしなくていいような気もします

    805 = :

    気がするとは？

    806 = :

    マシンが高性能になっているので
    マイクロ秒レベルのパフォーマンスの違いなんて気する時代ではないのでは？
    という意味です

    807 = :

    というか1マイクロ秒の違いすらあるのか怪しいですよね・・

    808 = :

    documentならいいだろうが複雑でパフォーマンス考慮のないCSSセレクタ書くとマイクロ秒オーダーじゃ済まないよ

    809 = :

    確かに引数に文字列を渡す場合はパース処理が入るので何度も実行したくはないですね
    引数がDOMオブジェクトの場合は許容範囲の感じがします
    場合によりけりということでしょうか
    ありがとうございました

    810 = :

    みんなjqueryオブジェクトには$付き変数つかってる？
    それとも気にしない派？ おれは気にしない派

    811 = :

    使ってる。
    生のelementも使うから。

    812 = :

    >>808
    > documentならいいだろうが複雑でパフォーマンス考慮のないCSSセレクタ書くとマイクロ秒オーダーじゃ済まないよ

    具体例あげられますか？

    813 = :

    そこそこの規模のDOMを用意し、CSSセレクタでパフォーマンスの観点から避けるべきと言われていること(ユニバーサルセレクタとか子孫セレクタとか一般兄弟セレクタとか)をあえてすべて踏む長めのセレクタをぶっこんでトライ！
    まさか計測まで人にやらせるつもりじゃねーだろうな

    814 = :

    >>813
    計測はこっちでやってやるよ
    お前は黙ってセレクタを書け

    815 = :

    >>814
    じゃ黙ってDOM用意しな。セレクタはDOM依存だからな。

    816 = :

    セレクタの遅さはDOM依存じゃないが？

    そんなにDOM用意しろって言うなら
    ほらよ。遅いセレクタ書いてみなｗ
    <span>a</span>

    817 = :

    DOM依存であることを示してるように見えるのだが…

    818 = :

    >>817
    オレなら >>816 のaを選択するのにたっぷり0.1秒はかかるセレクタを書くことができるッ！
    しかもそいつはつい先日納品したプロジェクトで使用したばかりのやつだッ！

    819 = :

    見たい見たーい！

    820 :

    >>804
    2回以上使う場合で、その間、変化が無いなら、変数に入れて使うべき

    変数に入れずに、2回書いたら、その間にDOM に、
    何か変化があるのかも、と思ってしまう

    変化が無いなら、変数に入れた方が、わかりやすい

    821 = :

    $(event.currentTarget)
    とかもわざわざ変数に入れるんですか？

    823 = :

    >>821
    アホなの？

    824 = :

    >>823
    何故そう思ったんですか？

    825 = :

    >>821
    入れてもいいってだけで基本的に変数に入れない。実行速度に問題があって
    変数に入れると速度の問題が解決するって場合だけ入れる。

    > $(event.currentTarget)
    > とかもわざわざ変数に入れるんですか？
    入れない

    $(this)もそうだが、カッコの中がDOM要素の場合は、セレクタよりも遥かに
    速度が早いので変数に入れても問題が有る速度を解決することにはつながらないだろう

    それから変数に入れる前にチェインでつなぐことを考えたほうがよい。
    チェインするのは変数に入れるのと同じ効果がある

    またそもそもチェインすらいらないかもしれない
    例えばこういう書き方もできる

    http://api.jquery.com/jQuery/#entry-examples-1

    $( "<div/>", {
    　　"class": "test",
    　　text: "Click me!",
    　　click: function() {
    　　　　$( this ).toggleClass( "test" );
    　　}
    })

    http://api.jquery.com/css/#css-properties
    .css({ "background-color": "#ffe", "border-left": "5px solid #ccc" })

    http://api.jquery.com/attr/#attr-attributes
    $( "#greatphoto" ).attr({alt: "Beijing Brush Seller", title: "photo by Kelly Clark"});

    826 = :

    この使い方も重要

    http://api.jquery.com/attr/#attr-attributeName-function

    $( "#greatphoto" ).attr( "title", function( i, val ) {
    　return val + " - photo by Kelly Clark";
    });


    1. title属性を取得して
    2. title属性を加工して
    3. title属性を再設定する
    ということを変数無しでできる

    引数に関数を渡すことで、変数に一旦入れる必要がなくなる。

    ↓つまりこんなコードを書かなくて良くなるということ

    var $greatphoto = $("#greatphoto");
    var title = $greatphoto.attr("title");
    title = title + " - photo by Kelly Clark";
    $greatphoto.attr("title", title);

    827 = :

    >>825-826
    ありがとうございます
    知らない方法ばかりです
    関数を渡してフィルタみたいな処理ができるのは良さげです
    変数をなるべく使いたくないっていうのは、
    関数型っぽく書きたいっていうところから来てるんですよね

    828 = :

    >>827
    名前を使いたくない ってのが一番大きい理由だと思うよ

    おれ自身はチョイ関数でもバンバン定義する派だけど、使いたくない理由もわかる

    829 = :

    >>820
    804ではないが参考になった
    以前速度差ないとのことで変数に入れずにいたが
    そういうことならわかりやすくていいですね

    830 = :

    普通はそう考えるものだよ

    831 = :

    変数使わないべき、それ以外認めんと徹底抗戦してたのいたからな

    832 = :

    >>820が変数に入れるべきと言った途端

    > 2回以上使う場合で、その間、変化が無いなら、変数に入れて使うべき

    ↓これだよｗ

    > 変数使わないべき、それ以外認めんと徹底抗戦してたのいたからな

    833 = :

    本人参上ｗ

    834 = :

    >>820
    > 変数に入れずに、2回書いたら、その間にDOM に、
    > 何か変化があるのかも、と思ってしまう
    >
    > 変化が無いなら、変数に入れた方が、わかりやすい

    どういうこと？
    変数に入れた所で、変化するでしょ？

    $id = $('#id')
    $id.text(123);
    $id.text(); // 変数に入れたのに123に変わってる

    jQueryにDOM要素の状態をさせるメソッドは
    たくさんあるけど、どれも変数に入れても変化するものばかり

    唯一の例外はremoveしても（DOMの状態は変化しているが）
    jQueryオブジェクトには参照が残ってるってことぐらい
    それだけなのに"変化がないなら変数に入れたほうがわかりやすい"は大げさ

    835 = :

    変数に入れてもDOMは変化してる
    変数に入れていれば、その間になにも変化がないように言い方は
    誤解のもとでしかないのでやめたほうが良い

    $ul = $('ul')
    console.log($ul.children().length) // 5
    $ul.children().remove();
    console.log($ul.children().length) // 0

    --------

    $ul = $('ul')
    console.log($ul.children().length) // 5
    $ul.append('<li>')
    console.log($ul.children().length) // 6

    --------

    $ul = $('ul')
    console.log($ul.parent().attr('id')); // undefined
    $('#id').append($ul)
    console.log($ul.parent().attr('id')); // id

    836 = :

    そりゃ再代入すりゃ変わるよ

    837 = :

    いや、再代入してないよｗ

    ----はただの区切り
    別々の話ね。

    838 = :

    >同じjQueryオブジェクトを使う時には

    とあるのに何入れ替えてるんだよｗ

    839 = :

    変数に入れても、
    ・DOM要素の内容は変わる
    ・DOMの構造も変わる
    ・DOM要素の参照は残ってる

    って所かな？
    jQueryとか関係なく

    var elm = document.getElementById('id'),

    って書いてるのと同じ。
    ID=idをdocumentのDOMツリーからremove()しても、
    elmという参照は残ったまま

    逆に言えば、参照は残ったままだけど、
    DOM要素への変更は反映される。jQueryでも同じ

    840 = :

    >>838
    めんどくせーな。
    これでお前でも理解できるだろ？
    変数に入れてもDOMは変化するんだって

    例1

    function exp1() {
    　var $ul = $('ul')
    　console.log($ul.children().length) // 5
    　$ul.children().remove();
    　console.log($ul.children().length) // 0
    }

    例2

    function exp2() {
    　var $ul = $('ul')
    　console.log($ul.children().length) // 5
    　$ul.append('<li>')
    　console.log($ul.children().length) // 6
    }

    例3

    function exp3() {
    　var $ul = $('ul')
    　console.log($ul.parent().attr('id')); // undefined
    　$('#id').append($ul)
    　console.log($ul.parent().attr('id')); // id
    }

    841 = :

    変数に入れておけば、異なる参照を指すことはない。
    このリストが、別のリストに変わったりしない

    変化する場合でも、その要素・コンテキスト以下・子孫要素しか変わらない

    祖先の要素が変わって、別の要素を指すようになったりしないから、
    意図がわかりやすい

    842 = :

    >>841
    よく考えてほしいんだけどさ、

    一行目、私は○○にデータを書き換えます。
    二行目、○○にデータが書き換わった状態であってほしい

    これの方が直感的だよね？

    843 = :

    >>840
    そんなことは書かれる前からわかっとるわ、基本だろ
    そういうことでなくて質問と>>838はDOMを変化させない前提だろうよ
    パフォーマンス云々言ってるのだし

    844 = :

    だから変数に入れてもDOMは変化しますよって言ってるんだが？


    変数に入れることで、どういう勘違いを
    あなたはしてるのですか？っていう話

    845 = :

    順を追って説明しないと理解できてなさそう

    1. DOMを変化させない前提
    2. 変数に入れないと、DOMが変化するように見える
    3. 変数に入れると、DOMは変化しないように見える
    4. でも変数に入れても実際はDOMは変化する
    5. つまり3は勘違い。変数に入れてるのをみてDOMが変化しないように見えたら、それは目が悪い。

    846 = :

    久しぶりに除いたが「変数使わないべき、それ以外認めん」の人がまた勘違いで話捻じ曲げて強引に押し通そうとしてるのか

    847 = :

    その話は知らんけど、>>845に何か物申すこと有る？

    848 = :

    おっと、覗いただな、失敬

    849 = :

    × 変数に入れずに、2回書いたら、その間にDOM に何か変化があるのかも、と思ってしまう
    ○ 変数に入れても、2回書いた時、その間にDOMに何か変化があることがある。


    × 変数に入れるとDOMは変化しない
    ○ 変数に入れるとDOMを変化させてもDOM要素への参照は残っている

    なんで正しい説明ができないんだろう？

    850 = :

    >>844
    問題文をもう一度読もうか
    先ずはそこからだ


    ←前へ 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 次へ→ / 要望・削除依頼は掲示板へ / 管理情報はtwitterで / JavaScript一覧へ
    スレッド評価: スレッド評価について
    みんなの評価 :
    タグ : 追加: タグについて ※前スレ・次スレは、スレ番号だけ登録。駄スレにはタグつけず、スレ評価を。荒らしタグにはタグで対抗せず、タグ減点を。

    類似してるかもしれないスレッド

    トップメニューへ / →のくす牧場書庫について