jQuery 質問スレッド vol.7 [無断転載禁止]©2ch.net
■ このスレッドは過去ログ倉庫に格納されています
JavaScriptでDOM用ライブラリであるjQueryのスレです。
このスレはjQueryやjQuery UIの使い方やjQueryプラグインの作り方を質問するスレです。
jQueryを使って作る側のスレであって、こんなプラグインありませんか?と聞くスレではありません。
そういうのは自分で探してください。
ろくにサポートもされてなさそうな野良プラグインの使用はおすすめしません。
JavaScriptの質問は関連スレで質問して下さい。
■前スレ
+ JavaScript & jQuery 質問用スレッド vol.6 +
http://echo.2ch.net/test/read.cgi/hp/1465566635/
■関連スレ
+ JavaScript の質問用スレッド vol.122 +
http://echo.2ch.net/test/read.cgi/tech/1472426483/
+ JavaScript(ECMAScript)質問用スレッド vol.122 +
http://echo.2ch.net/test/read.cgi/tech/1472401404/
+ JavaScript の質問用スレッド vol.131 +
http://echo.2ch.net/test/read.cgi/hp/1478053599/
JavaScript ライブラリ総合質問所 vol.5 [無断転載禁止]©2ch.net
http://echo.2ch.net/test/read.cgi/hp/1465399470/
+ JavaScript & jQuery 質問用スレッド vol.6 +
http://echo.2ch.net/test/read.cgi/hp/1465566635/ >>316
タグに書いてあるのは属性なんだよ。
属性っていうのはattrでしか変えられない。
属性と値は違うものなんだよ。 >>318
>タグに書いてあるのは属性
その言い方だとvalue=""も属性となるな >>319
その通り。HTMLのinputタグのvalue=""は属性
そのHTMLをパースして表示されたインプット要素の値は属性ではない。
ブラウザでキーボードを叩いてインプット要素の文字を変更したとしても、
属性には反映されない >>316
順序がおかしい。デバグ中にたまたま・・・ってところは気にした方がいいよ。
Firebugか、ChromeのコンソールでDOM見ながらスクリプト書いてる?
jQuery読んでるページでそのまま記述して実行すればリアルタイムで確認しながら見れる。
コンソールに書き出すのも最初はいいけど、breakpoint決めて、要素を選んでHTMLの状態を確認できるようにするといいよ。 classもIDも属性なんだよな
この辺うまく認識してないと思わぬところでミスが起きる 【attribute】
西洋美術において伝説上・歴史上の人物または神話上の神と関連付けられた持ち物。その物の持ち主を特定する役割を果たす。 >>321
今回の件は見なくても問題なくスラスラ書けてますし、把握してるので特に必要にならない限り見ませんね。
別件で引っかかって確認してたらその辺に行き着きつきまして。
>jQuery読んでる〜
やってます。
attrやdataはけっこう使い込んでるのでvalueの件は勘違いでした。 上から目線で基本的なこと説明してるのがいるが最初の人のほうが詳しいキガス >>318
>属性っていうのはattrでしか変えられない。
これが自分で書いてる他の部分と矛盾している
属性とはHTMLでいうものとattrそのものの2種類ある
この辺うまく認識してないと思わぬところでミスが起きる >>292
ありがとうございます!
すいません、近頃ビットコインの値動きが激しくてここを全く見てませんでした
ここまで心臓部が出来てたんですね
http://echo.2ch.net/test/read.cgi/tech/1416826139/851
助かります
以降はリンク先をウォッチさせていただきます >>314-317
これは、ちょっとしたパズルだな
>もしdiv1やdiv2にも<p>が有る場合には、そちらを検出したい
確か、jQueryの探索順序は、深さ優先探索だったかな?
まず最上位から、すべてのタグを探索すると、タグの配列が、深さ優先で、
0,1,2 〜 999,1000 と並ぶ
この配列の先頭から、<div id="div1"> を探す。
その次から、<p>を探す ローカルPCにHTMLと、以下のJSファイルを置いて、
Win10, Edge からJSONP で、2chにアクセスして、HTMLを取得しようとしているけど、
callback関数が呼ばれないというエラーになる
HTMLは文字化けしているけど、取得できている。
2chはSJISなので
ローカルに、サーバーを立てていないからなのかな?
var url = "http://hayabusa6.2ch.net/test/read.cgi/linux/1479499953/6"
// 全体の設定
$.ajaxSetup({
type: "GET",
dataType: "jsonp",
timeout: 60 * 1000
});
$.ajax(url).done(function(data, status, xhr) {
console.log( "成功" );
}).fail(function(xhr, status, error) {
console.log( "失敗", '\n', xhr.status, '\n', status, '\n', error );
// }).always(function(arg1, status, arg2) {
}); 332の続き
HTMLは文字化けしているけど、取得できている。
2chはSJISなので。
xhr.status は200
だから別に、callback関数は必要ない。
fail じゃなくて、done になってくれれば、data が取得できるのだが ブラウザからのクロスドメインは難しいから、
YQL (Yahoo! Query Language)のサービスを使って、クロスドメインを可能にする、
jquery.xdomainajax.js プラグインを、試してみようと思う
こらこら団報告書生成
http://hotmilk350ml.web.fc2.com/korakorashot.html
元々、このツールでも、このプラグインを使っているし
でも、世界中の人が、YQLを使ったら、どうなるんだろう。
2chでもYQLを、アクセス禁止にするかも知れない >>331
を修正
>>314-317
すべてのタグを探索しなくても良い
最上位から、すべての<p> or <div>(または<div id="div1">)を探索して、
<div id="div1">を探す。
そして、その次の<p>を探す >>335
>>315で答えがでているものを小難しく考えて持論を長々と書くのは止めてくれ >>332
別件で今更jQueryのajaxについて調べる必要が出たから、
あとでちゃんと調べることになるけど、今はめんどくさいので
うろ覚えで答える。
あんた、jsonとjsonpを勘違いしてるだろう?
jsonはJSON形式の文字列を返すものであるが、
jsonpはJSONを引数にして関数を呼び出す "コード" を返さないといけない。
デフォルトの関数名はcallback。
つまり以下のようなコードを返す必要がある。
callback( {"num":[1,2,3], "abc":["a","b","c"]} );
そうすると、あんたがソースコードに定義してるはずの
callback関数が呼び出される。
>>333
> だから別に、callback関数は必要ない。
jsonpを使用している以上、あんたはcallback関数を定義しなければいけないし、
サーバー側からはcallback関数を呼び出すコードを返さないといけない。
jsonpを使用している限りcallback関数は絶対に必要 $.ajaxSetup({
type: "GET",
dataType: "jsonp",
// jsonpCallback: "callbackName",
timeout: 60 * 1000
});
dataType: "jsonp" を指定すると、jQuery が自動的に、jQuery1900〜のような、
ランダムで重複しないcallback関数名を作るから、
jsonpCallback: "callbackName" で、自分で指定しなくてよい
ただ、ブラウザという環境がダメなのかな、と思っている。
サーバーを立てていないから、サーバーからcallbackしてもらえないのかなと
だから、YQLのように、サーバー(プロキシ)を通すと、
そこから、callbackしてもらえるのかなと
本来は、wget, curl みたいに、2chからHTMLを取得できれば良いだけ。
HTMLさえあれば、そこからjQueryでタグを抜き出せる
ただ、ブラウザ環境で、JavaScriptでは、クロスドメインで苦労する >>339
名前欄の331は、271の間違い
まあ、同一人物だけどなw >>339
>>338の内容を少しだけ修正する
あんた、jsonとjsonpを勘違いしてるだろう?
jsonはJSON形式の文字列を返すものであるが、
jsonpはJSONを引数にして関数を呼び出す "コード" を返さないといけない。
デフォルトの関数名はcallback。
つまり以下のようなコードを返す必要がある。
callback( {"num":[1,2,3], "abc":["a","b","c"]} );
そうすると、jQueryが用意してくれているcallback関数が呼び出される。
>>333
> だから別に、callback関数は必要ない。
jsonpを使用している以上、内部でcallback関数が使われるので
サーバー側からはcallback関数を呼び出すコードを返さないといけない。
jsonpを使用している限りcallback関数は絶対に必要 通りすがりですが
jsonpからcallback()の部分を消せばjsonになると思っていいですか? サーバー側からJSONPを返してないのに
JSONPが使えるわけ無いだろう
馬鹿か ブラウザ環境では、JSでクロスドメインできない。
でも、HTML内で、
<script type="text/javascript" src="http://なんとか/aaa.js"></script>
のように、<script>タグを使えば、クロスドメインできる
だから、それを応用して、HTML内に動的に、<script>タグを作って、
アクセスする技術が、jsonp JSONPみたいなダサいハックをいったい何年放置する気なんだWeb系の連中は >>345
> ブラウザ環境では、JSでクロスドメインできない。
できる
>>347
> JSONPみたいなダサいハックをいったい何年放置する気なんだWeb系の連中は
7年ぐらい前に解決済み
年取ると、時間の流れが早いよねw >>348
どの辺が?
もっと簡単な方法があるならコードを書いてみて 読んだ上で>>315が一番簡単だと思った俺は異端なんかな?
長文書いてる奴は1行でかける事を何を難しく考えてるんだ、と思ってた まぁでもコードでバシっと書けないところがカッコ悪いんだよ
「おれ絵めっちゃ上手いぜ」 「へぇじゃあ描いてみて」 「こうやってああやって描けばいいんだよ」
「ん?描いてみて」
「・・・」
なんだわ 論点がずれてるよ
「小難しい」と指摘された回答が「小難しくない」から反論されてるんでしょ
「小難しい」といった人が小難しい理由を書くべきだよ
小難しくないコードを出せ、というのも筋は通ってる 難しいのがコードの問題なのか、人間の問題なのかを
見極める必要がある。
人間の問題、つまり(俺にとって)難しいとか言い始めたら
そんなのは無視した方がいい。
漢字読めない俺は難しいからひらがなで書けと
言ってるのと同じだから
高い技術を持った人が、そのコードは簡単というのであれば
それは人ではなくコードが簡単だと言えるだろう。
簡単なコードを読めるには技術が必要ってだけだ 無駄に長い長文だな
もうお互いにコードを出して第三者に評価してもらえばいいんじゃないの? >>357
あとでごちゃごちゃならないように、
良いコードの条件を言っておくわ
1. 「(俺が・初心者が)読めない」は理由にならない
2. 単語の長さは関係ない
3. 条件文が少ない。
4. ループが少ない。
5. 行数が少ない(ただし; で無理やりつなげたり、横100文字を超えるのはダメ)
6. 重複する単語やコードが少ない jQuery('#div1 p,#div1+p,:has( #div1) p,:has( #div1)+p,:has( #div1)+p')[0];
https://jsfiddle.net/eyg016m2/
あなたが小難しくないと思うコードを是非教えてくれ 一つ追加
なるべく少ない単語を使用する(複合語にしないということ) 重複したセレクタを削除した
jQuery('#div1 p,#div1+p,:has( #div1) p,:has( #div1)+p')[0];
https://jsfiddle.net/eyg016m2/1/ >>359
お前が書いたコード
'use strict';
var p = jQuery('#div1 p,#div1+p,:has( #div1) p,:has( #div1)+p,:has( #div1)+p');
p.each((i,p) => console.log(p));
修正後
var s = '#div1 p, #div1+p, :has(#div1) p, :has(#div1)+p';
$(s).each((i,p) => console.log(p)); >>363
後で扱いやすいように変数化しただけだから好きに改変してくれ
jQuery or $ もポリシーでどうとでも変わる程度の違い
それはともかく、>>315が小難しいといった人が書いたコードを早く見てみたいのだが $を使わずjQueryを使う人は、JavaScriptに慣れてない人だと思う。
ローカルスコープがよく分かってないんじゃないかな。
以下のように書けば、$はかならずjQueryになることが保証されるので
いちいち長い単語を使う必要がなくなる。
jQuery(function($) {
・・・
}
(function($) {
・・・
}(jQuery)); 本題とは関係ないところに反応して何がしたいんだ?
$('#div1 p,#div1+p,:has( #div1) p,:has( #div1)+p').each((i,p) => console.log(p));
for (let p of $('#div1 p,#div1+p,:has( #div1) p,:has( #div1)+p')) { console.log(p); }
こんなものは好みや流儀の違いであって「>>315が小難しい理由」にはなってない >>365
悪いが、両方とも知っている
jQuery を使用するのは検索性/可読性の観点からであって「$ をローカルスコープに閉じ込める方法を知らないから」ではない
>>358が指摘するように「単語の長さは関係ない」 単語の長さは関係ない。
だからこそ長いほうが可読性が高いわけじゃない。 "$" でgrep検索すると正規表現にもマッチしてしまうが、"jQuery" でgrep検索すれば jQuery だけが期待通りにマッチする
可読性は人それぞれ違うものなのでそこを議論するつもりはない
各々が読みやすい方を選択すれば良いわけで、言い換えれば、「あなたが好きな方を他人に強制する事」は出来ない
本題から逸れすぎているのでいい加減、話題を「>>314を実装する場合の小難しくないコード」に戻してくれ
>>315が小難しいというなら>>315の論理に沿ったコードも小難しいという事だ
あなたがたが書いたコードを俺のコードを元に作っているのだから、それも小難しいコードという事になる
では、小難しくないコードとは何なのだ?
俺はコードを出したのだから、そちらもコードを出してほしいのだがな > "$" でgrep検索すると正規表現にもマッチしてしまうが、
エスケープすればいいだけじゃね? > 可読性は人それぞれ違うものなので
それは間違い。
人それぞれ違うものを"可読性"と言ってはいけない >>372
君は問題の本質を理解していない
/hoge$/ という文字列にも $("p") という文字列にも "$" で検索してHITしてしまうのが問題
/hoge$/ にはマッチさせたくない場合にはどうやって正規表現を書くかね? 関係ないかもしれんが別の意味の$がマッチしてうざいときは$(とか$.で検索してるは >>375
では、jQuery.each や jQuery(function ($) {}) にはどうやってまっちするかね?
コード内の全ての jQuery を参照する $ を検索することが出来るかね? それは、jQueryで検索すればよかろう?
> コード内の全ての jQuery を参照する $ を検索することが出来るかね?
できるんじゃねーの?
お前が出来ないって思って出したはずのものを
今ことごとく論破したでしょw ちなみに、jQuery.eachとは書かない。
$.eachと書く。その検索方法は>>376が言ってる通り >>373
可読性は主観だ
あえていうならば、「jQuery の方が jQuery である事を明示的に表しているから」だがね
それは主観的な問題で $ と jQuery の可読性が高いなんて誰にも断定できないだろう?
先程から枝葉にしか反論が来ないようだな
反論がなければ、「315が小難しい理由はない」と判断する > それは主観的な問題で $ と jQuery の可読性が高いなんて誰にも断定できないだろう?
「単語の長さは関係ない」の通り、可読性と単語の長さは関係無い
可読性の話じゃないんだから、どちらが高いか断定できないのは当たり前だろ jQueryよりも$を俺がすすめるのは、
タイプするのが楽だからだ。
もう一回言うぞ?
タイプするのが楽だからだ。
書く時の話であって、読みやすい(可 "読" 性)とは言っていない。
可読性に関係ない = 可読性に違いがないのであれば
タイプするほうが楽な方が良いだろ? それなら、「単語の長さは関係ない」から「単語の長さは短い方がいい」に訂正しろよ
変数名も1文字だけ使えよ 1文字の変数名ってすげー読みにくい
可読性は主観ではないらしいから他の皆も読みにくいんだろうな
読みにくい書き方をする理由がタイプ数が少ないだけなら俺にはメリットがないな 本題(>>314)を無視してどうでもいい枝葉にしか反論がないのは何故なんだ?
アホらしくなってきた > 「単語の長さは短い方がいい」に訂正しろよ
訂正しない。短い方がいいとは限らないからだ。
短いか長いかは関係なく、それがそのコードを書く人(修正する人)にとって
よく知られている単語(新参者にとっては知るべき単語)かどうかだ。
$はjQueryのコードを書く人にとってよく使われている単語で
$を知らずして、jQueryのサンプルコードを読むことは出来ない。
だから明らかに、jQueryのコードを書く人は$の意味を知っている。
だから、前提をつけて「よく知られている単語の場合は短い方がいい」となるが
それはあくまでタイプするのが楽であるという意味であって、可読性の話ではない 単語の長さは関係ないと言ってるのに、
長い方がいい、短いほうが良いと、決めつけたがるんだよなw
ほんとバカやで 略よりも長いほうが明示的だと思ったんだろう?
正確に言うならば、$は略ではなく短い別名だが。
可読性で重要なのは意味がわかるかどうかであって
言い換えると誰でもその単語の意味を知っているか?
という話なんだよ。 略称がいいか正式名称がいいかの違いに標準を求めるのが間違ってる 標準を求めるってなんのことだ?
(単語の長さに関係なく)よく知られている単語か、
そうでないかの話しかしてないぞ >>392
知ったうえでどちらを使うかは自由だろ
お前が主張する「単語の意味を知っているか」は知っているなら$を使うはずだ、といいたいんじゃないのか? >>393
どちらでもいいのであれば、
タイプが短いほうが楽だろう? >>394
それがお前の中で「標準を決めている」といってるんだよ
タイプ数が重要じゃない人の事も考えろ >>395
タイプ数しか違いがない問題なのに、
何をお前は基準にしてるのだ? 検索性は変わらないことを実例を持って示した。
jQueryのコードをメンテナンスする人で$を知らない人はありえない。 「優先順位の違い」とか「単語の好みの違い」とか、いろいろあると思うけどな
JSと略する事を嫌ってJavaScriptと正式名称を書きたがる人もいれば、短く書くことをの好む人もいる >>398
例えば、var a = $; なんてコードに先の事例はマッチしないよな
揚げ足取りじゃなくて俺は「全てのパターンで $ を検索可能か」で考える
jQuery なら少なくとも$よりも正確に検索できる
「分かりやすさ」は知っているか知らないかの問題じゃない
整数型の変数を定義する場合に i と integer のどちらを採用するか、レベルのもの
それから、俺にとってはタイプ数は「どうでもいい」 >>400
それは揚げ足取りだなw
自分でそう思ってるから、否定するんだろ
$で検索すれば全部見つけることが可能。
余計なものが多すぎるなら、grep -v ででも消せばいい
はい論破w >>400
> 整数型の変数を定義する場合に i と integer のどちらを採用するか、レベルのもの
え? お前、みんながiを使うような緒齧ハで、
integerって名前の変数を定義するんの?w
iはイテレータとしてよく知られているか単語だから
みんなiを使うんだよ? >>401-402
検索性は高い方が好ましい
jQueryが$よりも検索性が高い事は誰にも否定できない
お前とは評価基準が違うだけなんだが、唯我独尊な奴だな > jQueryが$よりも検索性が高い事は誰にも否定できない
さっきからずっと否定しているが?
っていうか、そこまで検索に頼るっておかしくね?
どこに何がわからないから検索してるんだろ?
設計レベルでおかしいってことだよ。
jQueryはDOM操作をしている所と言い換えることができるが、
俺は「DOM操作をしている所」という条件で検索することは殆ど無い。
検索するとしたら特定の変数名やクラス名で検索する。 いや、こう書いても意味がわからんか?
変数名iはイテレータの略としてあちこちで使われるが、
変数名iで検索することはないだろう?
変数名iを検索の目的として選ぶことはないから。
それと一緒だよ。
jQueryという単語を検索したいなんてことはまずない この人は思い込みが強すぎて他人の意見を正しく理解できないんだな
無駄に改行を入れて冗長な文章になってるのもマイナス JSスレで散々見た流れだな
1. 回答をけなす
2. コード付で反論される
3. 初めにけなした内容では論破できないので、「取っつきやすそうな理由」を見つけてけなす
けなす内容は何でもいい
本題から大幅にずれても関係ない
とにかく、相手を論破出来れば何でもいい >>314
var answerFlag = false;
// #div1 または、p
$("#div1, p").each( function(index, elem) {
if ( true === answerFlag ) { // #div1 の次の要素
console.log( index + " : " + $(elem).text() );
return false; // each から抜ける
}
if ( "div1" === elem.id ) {
answerFlag = true;
console.log( index + " : " + $(elem).text() );
}
}); >>402
ループ変数iって読みにくくない?
そこもキッチリ名前を付けたほうが読みやすいよ ループ変数名よりブロックの長さやネストの深さの方が問題
そこがちゃんとしてればijkでなんの問題もない iは分かるけどjは絶対止めたほうがいい。普通に読み間違える
使うのはいつもikmだわ 結局、出たコードは>>409だけで「315が小難しい理由」は分からず仕舞いか
時間の無駄だったな 蓋を開けてみれば、315のコードが圧倒的にシンプルで文句のつけようがなかった >>414
だいたいいつも男なんて 甘ったれで情けなくて ■ このスレッドは過去ログ倉庫に格納されています