+ JavaScript の質問用スレッド vol.123 + [転載禁止]©2ch.net
JavaScript を自ら学ぶ人のための質問スレッドです。
>>2-4のテンプレを読んだ上で質問してください。
■質問を書く上で
(1) 煽り、コード制作依頼等、人を不快にさせる投稿はご遠慮下さい。公序良俗を守った応対を心がけてください。
(2) 他の人に迷惑をかけるスクリプトの質問はご遠慮ください。
(ブラクラ、[戻る], [閉じる], [クリック] の妨害、画面占有など)
(3) 質問者及び議論を行う人はメール欄を空欄にし、名前にレス番を入れることを強く推奨します。回答者はなりすましを判断できませんので、なりすましが現れても自己責任となります。
(4) 常に自発的に調べる心構えを持ってください。
具体的には「自分で調べてから質問する」「回答をもらってわからない単語があればGoogle検索してみる」など。
わからない内容を代わりに調べてくれる回答者をお望みの方は余所で質問してください。
(5) 出来るだけ一般的な用語を使用してください。脳内オレオレ用語は混乱の元です。
(6) 出来るだけサンプルコードを掲示してください。言葉による説明は行き違いが生まれる場合があります。
※必ず「問題の事象が再現されること」を確認してください。
必要な部分だけ切り出したつもりで現象が再現できていなかったケアレスミスがしばしば見られます。
(7) サンプルコードに HTML が含まれる場合は
http://validator.w3.org/ で [Check] してみてください。
(8) 質問を具体的かつ詳細に書くと回答を得られやすいです。
>>2の質問テンプレートを活用してみてください。
(9) 時にはあなたが望む「答え」だけでなく、「意見」などが寄せられる場合もあります。
+ JavaScript の質問用スレッド vol.122 +(c)2ch.net
http://peace.2ch.net/test/read.cgi/hp/1420095379/ (ライブラリ禁止条項は、多数の意見によって廃止されました。ライブラリの質問もOKです)
■主要FAQ (全部は
http://fiddle.jshell.net/vSqKr/33/show/ )
Q1. 別窓・フレーム内容やローカルファイルを読み書きしたいのですが…
A1. 別サーバのページやファイルの内容はセキュリティ制約でアクセス不可です。
Q2. document.write()でページ内容を追加したいのですが…
A2. 一度表示完了後にwriteするとページ内容が消去されます。DOM等別手段を。
Q3. table内容のinnerHTMLやDOMでの変更がうまく行かないのですが…
A3. IEではtable/tbody/trのinnerHTML書き換え不可です。DOMを使いますが、
DOMの場合tableの直下にはtbody要素が(作らなくても)あることに注意。
Q4. フォーム部品名を変数にした「...myform.変数名.value」が動きません…
A4. 「document.forms.myform.elements[変数名].value」でどぞ。
JavaScriptでは一般に「obj.x」と「obj['x']」は同じ意味です。
グローバル変数はwindowのプロパティなので「x」と「window['x']」も。
Q5. CSSで設定した背景色がe.style.backgroundColorで取得できないのですが…
A5. 取得には document.defaultView.getComputedStyle() を使う必要あり。
IEでは要素オブジェクトのプロパティcurrentStyleを使う。
Q6. setAttribute("class","foo")、setAttribute("onclick","bar()")が動きません…
A6. IEではそれは不可。「obj.className="foo"」「obj.onclick=bar」でどぞ。
Q7. タイマーやイベントハンドラに設定するコードにthisを含めたいのですが
「"...this..."」とか「function(){...this...}」ではうまく行きません。
A7. 実行時にthisが別のものを指してしまってる。以下のようにthisを束縛保存。
「function(x){return function(){...x...};}(this)」
Q8. input type="file"の値を設定(参照)できないのですが…
A8. セキュリティ制約のため設定は絶対に不可。参照はブラウザにより不可。
Q9. getElementById('ID名')や$('ID名')で要素が取れないのですが…
A9. コード実行時点でHTMLがそこまで読まれてない。window.onload 中でやるとか。
■諸注意
vol.116で一人の心ない人が勝手に決めたライブラリ禁止は撤回されました。
今後はライブラリに関する質問も受け付けます。
ライブラリ禁止を叫ぶやからはスルーしてください。
9 :
Name_Not_Found:2015/01/24(土) 19:52:14.47 ID:vwrk6Z7/
以前、質問した者です
おかげさまでシステムが完成して300万円で飛ぶように売れてますw
教えてくれてありがとうございましたw
lodash 3.0 キタ━━━━(゚∀゚)━━━━!!
>>11 毎回そうだけど、現行スレでライブラリ禁止の話が出ると次スレを乗っ取ろうとしてフライングして立てる人が出てくる
いつもの事ながら呆れる
結局乱立させた自分のスレがどこも伸びないからって戻って荒らしてるよ
この状態が何年続くのかね
細分化しても伸びないんだから
JavaScriptは全部一つにまとめろって。
16 :
Name_Not_Found:2015/02/13(金) 23:22:56.63 ID:qxiSVRF8
言う事が全て嘘だからフォローする事もできないな...
あまりにも小出しな上に文句しか言わないからめんどくさい。
何でJS使わないといけない縛りしてんの
20 :
Name_Not_Found:2015/02/13(金) 23:27:48.96 ID:qxiSVRF8
もういいです!
JavaScriptの質問なのにCSSでしか解答しない人には用はありません
「ヘッダー固定 アンカー」でググれば腐るほど答え出てくるけどな
そんなにJavaScriptを使いたいならJavaScriptでCSS追加すれば解決するだろうに考える頭もないのか
「(10) 時にはあなたが望む「答え」だけでなく、「意見」などが寄せられる場合もあります。」と書いてあっただろうに
テンプレを全く読んでないんだろうな
chromeのtweetdeckが最近急に落ちるようになりました
タブごと死ぬのです
JavaScriptが原因でブラウザが落ちるってヤバくないですか?
JavaScriptでChromeが落ちることはありえないので、
つまりJavaScriptが原因じゃないってことです。
tweetdeckはJavaScriptで動いているはずなので他に原因は考えられませんが
>>24 JavaScriptで死ぬことも当然あるし、他の原因で死ぬこともある
ところで質問は?
>>28 ヤバくないですか?
って聞いてるのが分からないんですか?
ヤバくはないし、JavaScriptが原因かどうかも疑わしい
いえ、断じてヤバいです
>>32 あなたがそう思うならヤバいんだろうね
頑張ってね
strict mode でグローバルオブジェクトを取得する方法で、こんな方法を見かけました
function f(window){
"use strict";
var global = (0,eval)("this");
}
f();
なぜこの方法で行けるのですか?
eval("this")だと確かにグローバルオブジェクトが取得できないのですが、上の方法でなぜ取得できるのか分かりません。
evalのthisが指しているオブジェクトがwindowだから
window.eval
>>34ではないが、なぜ this でグローバルオブジェクトを参照できるのか理解できない
(function () {
'use strict';
console.log(eval('this')); // undefined
console.log((0,eval)('this')); // [object window]
}());
Strict Mode 影響下にあるのだから this === undefined になるべきだと思うが、考え違いをしているのだろうか
なぜ後者だけグローバルオブジェクトを参照できるのか理解できない
そもそも、こういう場合はスコープの関係上、Function を使うものだと思っていたのだが…
だと思うじゃなくてコードを実行しろよ
(function(){
console.log(this);
})()
>>37 「Function を使ってグローバルオブジェクトを取得する方法を教えてくれ」という質問だと勘違いしてるんじゃない?
ところで、このスレは継続して使うのかな
荒らしの立てたスレだから誰かが前スレで作られたテンプレ通りに立て直すものだと思っていたんだけど
(自分は制限ホストの為、立てられない)
>>34 >>36が触れているように実行するスコープが違うだけ。strict mode自体はあまり関係ない。
>>34の例だと、evalのコードはグローバルスコープで実行されるので、this===windowとなる。
説明すると結構ややこしいけど…もし興味があるなら、以下の説明をどうぞ。
evalの実行には"Direct Call"と"Indirect Call"の2種類の方法がある。
前者はローカルスコープで実行され、後者はグローバルスコープで実行される。
(他の関数には存在しない特性なので、要注意)
http://www.ecma-international.org/ecma-262/5.1/#sec-10.4.2 "Direct Call"になる(=ローカルスコープで実行される)条件は、以下の全てを満たすとき。
(1) CallExpression の形で実行されること
(2) CallExpression を構成する MemberExpression の型が Reference であること
(3) Reference の base が environment record であること
(4) base の reference name が "eval" であること
逆に、(1)〜(4)のどれか一つでも満たさない場合は、"Indirect Call"(=グローバルスコープ)になる
http://www.ecma-international.org/ecma-262/5.1/#sec-15.1.2.1.1 (1)〜(4)を全部説明すると長くなるので、自分で調べるか、分からなかったら言ってくれ。
eval("this") だと(1)〜(4)すべてを満たすので、ローカルスコープで実行される。
(0,eval)("this") だと(2)以降を満たさないので、グローバルスコープで実行される。
42 :
36:2015/02/14(土) 13:44:05.58 ID:???
>>41 ありがとう
完全ではないが、理解した
("Indirect Call" は Function('return this;')(); と何も変わらないわけでバッドノウハウに留まる感じだが、知識として覚えておきたかった)
(function () {
'use strict';
var globalEval = eval;
console.log(eval('this')); // undefined
console.log(globalEval('this')); // [object window]
}());
> strict mode自体はあまり関係ない。
Strict Mode でなければ "Direct Call"と"Indirect Call" のいずれも this === window となるのだから無関係とはいえないのでは?
>>34は Strict Mode でもグローバルオブジェクトを参照する方法を求めて質問したのだと想像するが…
43 :
36:2015/02/14(土) 13:56:20.43 ID:???
44 :
41:2015/02/14(土) 14:48:51.13 ID:???
>>42 「Strict Mode 自体はあまり関係ない」と言ったのは、this に限らず他の変数にも言えることなのでそう記述した。
var hoge = "global";
(function(){
var hoge = "local";
console.log( eval("hoge") ); // local
console.log( (0,eval)("hoge") ); // global
})();
それに、非Strict Mode でも this が window 以外のことはいくらでもあるから、Strict Modeが関係あるというのは語弊があると思った。
まあこの辺は言い方の問題なので、あまり突っ込まないでほしいw
おっしゃる通り、"Indirect Call" は ES5 からの仕組みなので、例えば IE8 以前では上のコードは local,local になる。
この方法を用いるのは時期尚早だし、
>>42の指摘のある通りそもそもバッドノウハウの部類なのであまりお勧めできないだろう。
本来は放置するのが鉄則だし
あくまで避難先にしてテンプレ固まり次第早々に建てたほうがいいよ
>>47 そしたらまた建てなおされるだけだぞ。
それが嫌だって言ってるんだが。
Chromeの新しいタブを開いてdocument.titleを見ても空なんですがどうやってタイトルを取得できますか?
document.title = 'a'ってやれば勿論上書き輪出来るんですが取得だけできないようで・・・
新しいタブなんだから、空に決まってるだろ?
いやでもlocation.hrefはとれますよ
だから、URL=location.hrefに入っている奴、タイトル=空 なんだろ。
Title要素がないから取得した結果が空なんじゃない
ソースマップファイルというのを使えばminなJSでもデバッグできるようになるらしいですが
どういう仕組みで出来るようになるのでしょうか?
>>49 configData.translatedStrings.title
configDataなんてオブジェクトはありません
>>49 title要素がないんだから仕様通りでしょ
荒らしが建てたスレで、荒らし対策の話し合い…
なんか笑えてくる
>>57 お前は放置するんだよな。
うん。
で、お前だけが書き込むのか?
>>60 今まで放置され続けてきたのに今更何を言ってるのか
そんなに使いまわしたいなら君が率先して
>>11の若いスレから使ってきなよ
>>54 JS側にそういう仕様があるわけではない
Chromeにそういう機能が付いてる
63 :
36:2015/02/14(土) 19:13:15.81 ID:???
>>44 > それに、非Strict Mode でも this が window 以外のことはいくらでもあるから、Strict Modeが関係あるというのは語弊があると思った。
> まあこの辺は言い方の問題なので、あまり突っ込まないでほしいw
了解した
荒らしが新スレを立てようが放置すればいいだけ
荒らしの立てたスレを使うから荒らしが調子に乗って新スレを立てる
多分、近いうちにvol.124も立つだろう
使われると分かれば間違いなく立てる
立てても無駄だと理解させないと駄目
わかりやすく変な改行してるんだからスルーしときゃいいものを
>>62 ありがとうございます
知らないうちにそんな機能が付いてたんですね
別に立てんでもいいだろ
何個もこの板に乱立すんな
幼稚なアホがまた立てたのか
相変わらずカオスだな、JavaScriptスレは…
下から二番目は単なるミスっぽい気もするが
とにかくお疲れさま
いちいち荒らしとか認定してる奴が幼稚きわまりない
ネトウヨかよ
あるスレを淡々と消化していけよ
しょうもない
しれないな
じゃねーよクズが
よく見たらスレありすぎわろた
スレ立て権を無駄に消費すんな
先に立ったスレに優先権があるんだからそのスレを粛々と使っていけばいいだけ
こうしてvol. 123スレは4つできたわけかw
次スレはいくつできるだろうかね?w
荒らしの学習能力の無さに笑った
vol.124でも無駄に新スレ立てるんだろうな
今だに手作業で次スレを立てるのって何でなの?
手間かかるし、混乱と喧嘩が絶えないし、良いこと無いように見えるけど。
とりあえず全部解消するまでスレたてんなや
>>81 2chに要望を出すか、2chに代わる掲示板システムを君が開発してくれ
>>80 たてるなよ。たてるなよ。
ダチョウ倶楽部ですね?
自動で立つと切りがいいからここで終わりにしようって事が出来なくなるだろ
それに新規に建てる事なんていくらでも出来るし自動で建てる事のメリットはほぼ皆無
精々スレ番がちゃんとインクリメントされるぐらいだ
テンプレに相当する情報をwikiのような共有スペースにして次スレ作成ボタンを主導で押して次スレを立てられるなら便利かもな
同じスレグループは同一リストに入れる事も出来るし
そしてテンプレに相当するwikiを書き換えて
スレ立てボタンを押す。いいね。面白いw
window.hogeに何も値を入れなければundefinedですが
一時的にwindow.hogeに値を入れて削除したい場合はwindow.hogeにundefinedを代入すればいいんですか?
それともdelete window.hogeしたほうがいいですか?
>>89 値を代入する前と同じ状態にしたいなら、delete
つかいますをつかうようにしますdelete
あとすいません
var hoge = 1;
(function(){
'use strict';
console.log(window.hoge);
delete window.hoge;
console.log(window.hoge);
}());
これ実行すると Uncaught TypeError: Cannot delete property 'hoge' of [object global]って出てdelete出来ないんですがなぜですか?
ちなみに'use strict';を消すとdeleteしたら2番めのconsole.logでundefinedになってくれました
なんでstrictモードだとこれでhogeを削除できないんですか?
↑
荒らしいい加減にしろ
Math.random()って偏りがあるんですか?
線形合同法でググれ
このスレいつからscになったの?
間違ったスレで質問したようなので
こっちで質問し直しただけですが?
変な言いがかりはやめてもらえますかね
test
-[]って使い道ある?
105 :
Name_Not_Found:2015/02/15(日) 23:43:07.85 ID:M+u02rhw
質問をコピペしないでください。マルチポストになってしまいます
109 :
Name_Not_Found:2015/02/16(月) 06:40:42.44 ID:Ig42YN7J
ふと思ったのですがjavascriptにはgotoがありませんが
特に困った記憶がありません
なぜgotoがなくても問題ないのでしょうか?
110 :
93:2015/02/16(月) 10:16:04.97 ID:???
このスレで回答してくれるのは恐らく荒らしだけなので、回答が付かないようであれば移動することをお勧めします。
>>109 無理やりスパゲッティコードでも
文脈の外へgoto また文脈の中へ gotoくらいなら
callback関数でなんとかなるからかな
goto文が複雑に入り乱れたコードになると
さすがにほぐすのは大変だろうけど
>>112 違う違う
breakとcontinueにラベルを付けられるからでしょ
実質gotoと同じ機能だ
>>113 continue は行き先が決まってるし
break は元のブロックの内部に戻れないぞ
>>114 実質同じって事は仕様的に一緒って言う事じゃなくて通常使いの範疇で役割が一緒って事だ
(要するにネストしたループ内からの脱出)
ブロックの中に戻るなんてCでもまず間違いなくやらんぞ
それとcontinueもbreakと同じようにラベル使えるけど
116 :
bti:2015/02/16(月) 18:54:57.44 ID:ZOdRBOCQ
>>115 C だったら long_jump 使うことはあるんじゃね?
>>117 setjmp, longjmpだな
それは基本的にブロックどころか関数外に飛ぶ為のもんだ (スタックポインタをいじる為のもん)
>>109 > ふと思ったのですがjavascriptにはgotoがありませんが
> 特に困った記憶がありません
> なぜgotoがなくても問題ないのでしょうか?
gotoの代わりになるものが存在するから。
1. 関数呼び出し、return
2. continue、break
3. for
4. if 〜 else
5. try 〜 catch (throw)
こんな所かね?
これらの機能がない言語っていうのもあって
例えばアセンブリ言語なんか、3, 4, 5 が無いし
C言語でも5がない。
実はgotoは1〜5の機能を実装できる万能機能。
しかも1〜5では不可能な、どこにでもジャンプできるという高機能な点もある。
じゃあgotoだけがあればいいじゃん?って思うかもしれないけど
歴史的にはgotoが先に生まれて、そのあとgotoの「どこにでもジャンプできる」というのは
コードを著しく複雑にするというのが判明した。
「どこにでもジャンプできる」というのは欠点とみなされたわけ。
そののち制限されたgotoとして1〜5の機能が生まれた。
gotoが無いと困る言語っていうのは、1〜5の機能が無いか、
あってたとしても少し機能が足りないから。
>>119 随分適当だな…
gotoの代わりになってるのは2.5.だぞ
> 実はgotoは1〜5の機能を実装できる万能機能。
ジャンプ出来るのは関数内だけだ
そう考えると関数を越えられる5も違うと言える
ようするに2だけ
>>120 俺が言ってるGOTOっていうのは、
C言語のGOTOじゃなくて、BASICのGOTOだよ。
もちろんVBとかじゃなく、初期のBASICね。
BASIC・・・1964年生まれ
C言語・・・1973年生まれ
> ジャンプ出来るのは関数内だけだ
BASICのGOTOは本当にコードのどこにでもジャンプできた。
行番号指定でどこにでもね。
関数の呼び出し(そもそも関数がなかったが)の代わりとしても使えたし、
当然returnもGOTOで実装。
3と4はBASICにもあったと思うが、
これもGOTOで実装しようと思えば出来る。
2はBASICにあったかな? なかった気もするが。
GOTOの元をたどれば機械語のジャンプ命令に相当するんだよ。
その流れからBASICにもC言語にもgotoという名前で実装された。
その時にgoto(ジャンプ)の代わりになるものが追加された。
それが
>>119で書いた内容。
だけどまだ足りなかった。特に5の例外ができるのはかなり後だったね。
C言語では今でも例外がないからgotoが使われることがある。
エラーが発生した時にgotoで関数の後ろに飛ばすんだよ。
そのほうがスッキリかけるから。
最近の言語はほぼ全て例外をサポートしてるんで、
JavaScriptだけでなく最近の言語はgotoなくても困らないよ。
htmlとcssとjqueryをやり始めて三ヶ月なんですが自分が作っているサイトでjqueryを使いたいのですがどうしてもscrollがうまくいきません
アドバイス欲しいんですがファイルをアップしたら見てもらえますか?
ダメそうならもうちょっと考えます
jQueryのステマだよ。
jQueryは役割終了しているけれど、これを有料で布教して食っている、非技術系デザイナーのクズが少なからず存在しているからな。
因みに、ここ2年のJS実装では、匿名関数が本当に無名関数になった。jQuery布教者どもが匿名関数を何故か無名関数無名関数とほざいていたからか、JSが折れた形w
>>123 テンプレ見てなかった
すんません
でもjqueryは書くほどのレベルじゃないっていうかホントに初心者用参考書のレベルなんです
コードは間違ってないと思うんだけど…
とりあえず後で書いてみます
>>124 ありがとうございます
ちなみに使用してるブラウザはchromeです
後でコード書きますんでよかったらご指導お願いします
>>125 正直この業界に足を踏み入れたばかりなので無理関数とかわからないです
jqueryって嫌われてるんですかね?やっぱjsのが現場で使いますかね?
> jqueryって嫌われてるんですかね?
一番使われてるライブラリだよ。
ユーザが多いのは嫌われやすいものだ
>>125 原理主義者はどの世界でも意味不明だなw
いや、マジわからんw
130 :
Name_Not_Found:2015/02/17(火) 04:26:45.21 ID:i6q1/MwW
今やjQueryの機能はより良い形で標準で提供されているからな。
それも似ているがやや違うと言った物が多いので、jQueryを使い続けることは混乱の元になる。
その冴えたる例がProxy。いくらネイティブでProxyがThenableを考慮してくれたからといって、
同期/非同期の差で躓くことは多い。
もういい加減標準機能のポリフィルに切り替えていった方がいい。
>>130 標準で書くのとjQueryで書くの
標準で書いたほうが短くなる例
一つでもありましたっけ?w
というレベルだよな。
探せば見つかるかもしれないレベルだ。
明らかにjQueryの方が上だよ。
132 :
Name_Not_Found:2015/02/17(火) 04:45:51.09 ID:i6q1/MwW
>>131 なにを言ってるんだ???
Q.DefferdとPromise、Q.ajaxとfetch、animeteはanimateだし、
長さはほぼ変わらないよ。
でも機能的には標準のほうが上だし、後から出た分APIとしてもちゃんとしてる。
だからこそjQueryを使う意味は無い。
まだ標準で不足してるのはDOMの比較部分の一部などだが、そこだけjQueryのサブセットか何かを使えばいい。
>>132 ワロタw
単語の長さじゃないよ。
同じことをやるのにどちらが短いかだよ。
$(document).on('click', '.class', function() {
$(this).toggleClass('state', 'active');
})
例えばこれと同じことを標準だけで書いてみてよ。
134 :
Name_Not_Found:2015/02/17(火) 05:13:34.51 ID:i6q1/MwW
>>133 そういうニュアンスで言ったつもりだが。
DOM操作周りはまだ標準が不足してるからライブラリを使えばいいと言っている。
ただしClassのtoggleは標準機能を使うべき。
だがjQueryを使うとどうしても全体、不要なとこさえがjQuery流になってしまいがち。
だからポリフィル+最低限のライブラリでないといけない。
135 :
Name_Not_Found:2015/02/17(火) 05:28:33.18 ID:i6q1/MwW
一応書くとこんなかんじか
document.queryAll('.class').map(e=>
e.onclick = e => e.classList.toggle('state', true)
)
まーたいつものライブラリより短く書いてよ君か
>>135 ちょっと違うね。
それだと.classの要素が動的に増えた時に対応できない。
onclick属性を使ってるから複数のイベントハンドラに対応できない。
toggleClassの所は俺が間違えたから訂正しておく
$(document).on('click', '.class', function() {
$(this).toggleClass('state');
})
138 :
Name_Not_Found:2015/02/17(火) 09:36:29.82 ID:papArVWM
昨日書き込んだ
>>122です
$(function() {
var nav = $('#nav');
nav.hide();
$(window).scroll(function () {
if ($(this).scrollTop() > 100) {
nav.fadeIn();
} else {
nav.fadeOut();
}
});
});
画面をスクロールするとnavが表示されるようにしたいのですがうまくいきません。
先輩曰くcssのpositionのせいで動かないらしいんですが具体的に何がどうなったら動かないっていうのは説明できない(わからない)そうです
ブラウザはchromeです
よかったら知恵を貸してください
見えてないだけとか?navの縦サイズとcssはどうなってんの
140 :
122:2015/02/17(火) 11:41:26.92 ID:papArVWM
#nav {
display: block;
width:100%;
height:40px;
background-color:rgba(0,0,0,0.5);
position: fixed;
top:90%;
z-index: 255;
overflow-x: hidden;
}
こんな感じです
先輩が言ってたpositionはnavじゃなくてサイト全体でposition使いまくっているからうんぬんだそうです
マジでわからん......
$(document).ready(function() {
$("#me").click(function () {
$("#nav").fadeIn();
});
});
ちなみにクリックでのnavの表示は上手くいきました
まずはscrollイベントのリスナが実行されているかどうかをalertやコンソールで角煮する
さらにscrollTopが動いているかどうかを同様に確認する
そこから原因を推測して修正する
断片的なのでこれくらいしかアドバイスできない
もしピンポイントの指摘が欲しいなら
>>2のサイトに再現コードを貼ることだね
142 :
Name_Not_Found:2015/02/17(火) 12:37:59.16 ID:abz4w2Cl
>>137 もはやjQueryの機能を標準で再現できるかという話になってないか?
そこまで拘るのならもっと一般的なユースケースを挙げてほしいね。
まあそれはいいよ。
結局jQueryを前提にしたようなものしか出してこないだろうし。
143 :
122:2015/02/17(火) 14:23:02.68 ID:papArVWM
144 :
93:2015/02/17(火) 16:11:01.27 ID:???
どなたかわかるかたいませんか
>>143 確かにその先輩の言う通り、サイト全体を position: absolute; にしてるのが良くないね
本当ならサイト全体の構成を直すべきだけど、とりあえず
「$(window).scroll」 → 「$("#wrapper").scroll」
にすればいける
>>146 ありがとうございます!
時間的に全体をなおすのは難しいので#wrapperにつけることにします
>>142 ユースケースの話をするなら「古いブラウザでも動くようにしたい」も
立派なユースケースだと思うけどね。
それは置いといてなんかユースケース出せるわけないみたいなこと言ってるし、
想像力のないあなたに一般的なユースケースを。
ページ上にフォームがある。このフォームでsubmit(input,button関係なく)が
押された時に、二度押しを防ぐために、そのフォームに含まれるinput要素全てを
disabledにしたい。そして色も変えたい。
ただし、ページ上にフォームは複数あることもあるし一つもないこともある。
全てのページ、すべてのフォームでこのような処理を行いたい。
2度押し防止のdisabledをやったことがない人はいないと思うんで。
古いブラウザでもってのはポリフィルの役目じゃね
jQueryはブラウザ間の誤差を埋めて貧弱な標準機能を補完するために生まれたと思うが。
<FORM NAME="enq">
<INPUT TYPE="text" NAME="fugafuga">
<INPUT TYPE="hidden" ID="hogehoge" NAME="hogehoge" value="">
<INPUT TYPE="SUBMIT" VALUE="送信" ID="pekepeke" NAME="pekepeke">
</FORM>
<script>
document.forms.enq.hogehoge.value="saitama";
</script>
上記では、enq.hogehogeの中をJavaScriptでsaitamaにしておりますが、
enq.fugafugaの中で入力した値を、「送信」ボタンを押したタイミングで、
enq.hogehogeの中の中に入れるようにするには、どのようにしたらよいでしょうか?
例えば、fugafugaに「日本」と入れて送信した場合、hogehogeにも「日本」が入ってるような感じです。
それを言い出したら、jQuery自体にもバグはあるからな
ブラウザ固有のバグに比べたら少ないかもしれないが、だからと言ってjQueryを盲信すべきではない
1.viewでdomイベントをハンドリング
2.modelを変更
3.modelのイベントを、viewがハンドリング
4.viewが自分を変更
みたいな処理がありますが、
viewは1の時点で4の処理が想定出来ます
なので
1.viewでdomイベントをハンドリング
2.modelを変更
3.viewが自分を変更
という処理も出来ると思いますが
何故viewはmodelのイベントをハンドリングするのでしょうか?👀
>>153 modelを変えるのは、そのviewだけとは限らないからだよ。
modelは色んな物から書き換える。
例えばカレンダーに新しいスケジュールを登録したら
カレンダービューが変わるのは当然として、
今日の予定ビューも変わるだろうし、
TODOリストも更新するかもしれない。
日付が変わったら今日の表示も変えないといけないし
スマホから登録したら、PCでみたブラウザのリアルタイムで変えたいかもしれない。
ビューがモデルを変えた時にビューを更新するだけだと
それ以外のビューが同じモデルを参照している時の処理が面倒になる。
モデルはいろんな処理によってどこからでも変わる可能性があるという前提で
変わったらそのイベント通知がきてビューを更新とすることで
何をきっかけに変わったとしても対応できるようになる。
良く分かりました
ありがとうございました
mb.miniAudioPlayerというのを使いたいのですがどうすればいいのかさっぱり分かりません
>>133 そもそもこの先はObservableの時代だと思う。
var mouseDowns = document.queryAll('.class').mouseDowns;
for ( evt on mouseDowns ) evt.target.classList.toggle('state');
とES7の時代では書けるらしい
そもそもViewはModelを変更しない
入力を受け取るのはControlでViewはその橋渡しをするだけだ
>>158 それは本来のMVCじゃなくて
ウェブ用にへんに歪められたMVC2
>>158 それはJavaScriptのフレームワークを知らない人の意見
JavaScriptで、「html自体はリロードするが、それが使用する画像などはリロードせずキャッシュを用いる」リロードを行いたいのですが
何か良い方法は無いでしょうか。
chromeで動作を見てみたのですがlocation.reload()だと画像もリロードしてしまいます。
location.href=location.hrefでも同様です。
クエリの部分に変更を加えた場合
(たとえばexample.com/reload.phpでリロードを行う場合、location.href="example.com/reload.php?time="+Date.now();などとする)
目的の動作になるのですが、この方法以外で実現可能でしたら
教えていただけないでしょうか
サーバー側で画像をキャッシュさせる設定にしろ
しています
>>161 試してはいないが
img の srcをロード後にスクリプトからあてがうようにすれば
htmlがリロードされても画像はローカルキャッシュが効くのではないか?
>>161 chromeのスーパーリロードは Ctrl + Shift + R で意識的にしないとできなかった気がするが
ほんとにそれキャッシュからではなくサーバーからデータ受信してる?
>>159 本来のMVCは
入力→C→M→V→出力
だよ
目的はModelからその他を分離させることだから、Modelが中心
ビューがモデルに対して視覚的なイベントを発行し、それをビューで受ける、
というはアリなのでしょうか?
そういう例が「backbone.jsアプリケーション開発ガイド」にあるのですが。
英語になりますがここに書籍と同内容のサイトがあります
http://addyosmani.github.io/backbone-fundamentals/#application-view AppViewのfilterOneメソッドの中で、
todo.trigger('visible');
と、todoモデルに対してイベントを発行。
そのイベントをTodoViewがハンドリングして、toggleVisibleメソッドを実行。
つまり異なるビュー同士が、モデルを介してメッセージをやりとりしている形です。
しかしモデルに対してvisibleというカスタムイベントを発行するのは何となく違和感があります。
でもモデル自体はvisibleの処理内容に関しては何一つ関知していないので、
こういう使い方はいいのでしょうか?
Modelが入力イベントに対して反応するのはMVC的には変。
それだとModelControllerになってしまう。
でもMVCではなくView層とそれ以外の分離と考えれば変ではない。
>>164 ですね、ただリロードのためだけの特殊な事は余りしたくないのです
(クエリの変更を避けたいのもそれが理由です
>>165 すみません、コンソール見直したのですが間違っていました。
location.reload()などの方法だと画像などはキャッシュを全く使わないわけではなく
if-modified-sinceやif-none-matchなどを吐き更新を確認しているようです
ただ、更新のための通信自体は行われているので
クエリの変更によるリロードよりも遅く感じます
(developer toolsのNetworkタブで確認しても時間がかかっています)
サーバー側から吐くキャッシュコントロールのヘッダの種類も含めてもう少し見直してみます
app.Todos.trigger('filter') のようにしてコレクション上でfilterイベントを発生させます。
これによって、それぞれのTodo項目の表示と非表示が切り替えられます。
という文章も出てきました。コレクションというのはbackboneではモデルの集合のことです。
JavaScriptがクライアントサイドである以上、
モデルに対しても表示まわりのイベント発行は許されるのでしょうか
そこまで分離してないというか
>>166 > 本来のMVCは
> 入力→C→M→V→出力
それはSmallTalkを知らない奴の意見。
本当のMVCは
Model ←→ View ←→ Controler
↑ │
└───────────┘
http://csis.pace.edu/~bergin/papers/mvcnew.gif > 入力→C→M→V→出力
これはMVC2
JavaScriptの時代になってようやく本当のMVCの話が出てきただけ。
WindowsなどでGUIアプリを作っていた人間なら、本当のMVCを知っている。
その後でウェブが出てきて、MVC2をみて、なんじゃこりゃ?って思ってた。
そして、やっと本当のMVCができるようになったのかよって苦笑してる。
>>168 > Modelが入力イベントに対して反応するのはMVC的には変。
MVC的にはおかしくない。ウェブアプリで歪められたMVC2的におかしいだけ。
最近のJavaScriptはようやくデスクトップGUI波のことが出来るようになったから
本当の意味のMVCができるようになった。
本当のMVCではビューがモデルを変更する
>>171 > それはSmallTalkを知らない奴の意見。
ま、Smalltalk をうっかり SmallTalk と書いちゃう人の場合
自分も Smalltalk のことはろくすぽ知らないけどな!って自己紹介しているようなもんだから、
この人が書いていることも、どこまで信用してよいやら…
なんだやっぱり
>>166 の概念が正しいんじゃん。
あるControllerからModelに通知が行き変化があった時、
その変化はそのControllerに付随するViewだけでなく
全てのViewに通知されるべき。
というのは参考になりました
そういうmodelのパブリッシュ性から、
>>167のように視覚的イベントもmodelで発行するという発想になっているのかもしれません
個人的には視覚的要素が絡むならviewがイベントを発行するべきじゃないのかと思ったのですが
viewがviewをobserveするというのはMVC的にないのかも
ちなみにbackboneにはControllerクラスがなく、VとCをViewクラスが担当しています
modelのイベントをトリガーしているのは実際にはCがしているということになるのでしょう
MFCはDoc-Viewアーキテクチャだね
ModelとViewの関連性を疎結合にする必要がなければコントローラは
いらないって事なんだろう
Modelの状態はチェクボックスその他のView部品に丸投げしたくなる
mvvmっていうのの説明を読んでいたら、
これが理想に近い気がしてきました
理想というか、現実じゃね。
どうしてもVがVMになってしまうというか、してしまいたくなるというか。
>>176 > なんだやっぱり
>>166 の概念が正しいんじゃん。
だからそれはMVC2だって言ってるじゃん。
MVC2としては正しいよ。
>>175を見てもまだそんなことが言えるのか
SmallTalkを知ってる奴はやっぱり違うな
まあ>175が間違いなんだけどなw
>>184 > Viewは視覚的なすべてを扱う。
> モデルにデータをリクエストして、それを表示する。
モデルにデータをリクエストして!
モデルにデータをリクエストして!
モデルにデータをリクエストして!
モデルにデータをリクエストして!
>>175で見て思うのは、
RailsとかJavaScriptとか
1998年に既にJavaで通った道に
やっとたどり着いただけなんだよな。
最先端のつもりでいるのに、15年以上前だったw
ジャバおじさん
クライアントサイドはサーバサイドのMVCより難解に感じる
他のハンドラを反応させるためにイベントを起こすけど
そのイベントが誰に何をさせようとしているのか、
イベントを見るだけでは分からないので
プログラムの流れが読み取りにくい
asm.jsってどうなん?
デザインしたいだけの一般スクリプターには数字の計算が早くなるだけならあまり恩恵なさそうだが
191 :
Name_Not_Found:2015/02/20(金) 13:27:00.73 ID:inmbenfW
>>186 ViewとModelの関係がリクエスト-アンサー型かオブザーバー型かその他かはMVCの本質的に関係ない
>>190 マイクロソフトがサポートを表明したばかりだね
すぱるタンに搭載されるかは不明
確かにゲームや画像処理などcanvas使う以外ではあまり恩恵がなさそう
簡単なプログラム作りたいんですが教えてください
5択のセレクトボックスを作る
選択によって10点から50点まで点数をつける
そのセレクトボックスを複数作り合計値を出力する
>>190 asm.jsは直接使うものではなくC,C++で作ったプログラムをそのままブラウザで動かすためのもの
asm.jsは文字列すらない、ArrayBufferをメモリに見立ててアクセスするもので、
文字通りアセンブラみたいなもの。あまり人が直接書けるようなものではない。
人が書くことを考えればSaneScriptが現実的。
コンパイラっていうかトランスレータもあるけど決して手で書けないかと言うとそうでもない
バイトコードやネイティブコードになるわけじゃない
asm.jsは一見頑張れば手でも書けそうに見えるが、普通に変数を使うと速度が出ない。
速度を最大限だそうとするとArrayBufferまみれになってとても常人が手を出せるものではない。
良く知らんけど勝手にasmってくれるようじゃないと
いちいちそんなのに合わせて書いてられないわ
ぶっちゃけSoundScript/SaneScriptが実用化されたら、C++並にはなるだろう。
SaneScript/SoundScriptでは
・オブジェクトの拡張不可→連想配列が必要ならMapを使う
・任意静的形付け
・クラスベース(+プロトタイプベース)
・配列の特殊化
・その他strict modeの強化版のような制限
となるもよう。
>・任意静的形付け
これだけでも相当速くなりそう
静的型付けだけで劇的に早くなることはないと思う。
今だって十分に整理されたコードでは型推論が効いてる。
Aの場合、Bの場合、そうでない場合のフォールバックとなっていたネイティブコードが
Aでなければ即ランタイムエラーにできて、何分の1にもなるのと、チェックを省けるケースも増えるだろうけど全く要らなくなるわけではないから。
基本的にCPUのキャッシュや投機にヒットしやすくなる程度の効果だと思う。
function f(t){
console.log(t);
setTimeout(f, t);
}
f(1000);
1秒待機して実行したいんですが、これ2回目以降はundefinedが出力されるのはなぜですか?
function f(t){
console.log(t);
setTimeout(f, t, t);
}
f(1000);
>>205 setTimeoutのfは引数が無いでしょ
タイムパラドクスだ!
あ、そうか、たしかに引数をあたえてなかったですね!
Cとかまともに書いたことなくて変数の型や初めて使うArrayBuffer(結果出力のみに使用)に苦戦しながら
やっと動かせたRGB→HSV色変換関数のasm.js版
Firefoxは122ms→374msで3倍遅くなったのにChromeでは241ms→62msに4倍速くなって驚いた
まだ変数とかそのままだから
>>198のようにすれば高速化できるのか
asm.jsはFxではオーバーヘッドが大きいし、ネイティブ関数と同じでインライン化等の最適化が効かないから
一般に小さくてとても軽い関数では効果はでない。asm.jsで書くなら書けるところ全部をそうしないと。それが罠。
node.jsってwindowsでも使えるんですか?
使えます はい次の人
じゃあ使ってみたいですけど
サーバサイドをやるのはちょっと怖いです
みんなやってるんですか?
やっている人もいますし、やっていない人もいます
はい次の人
普段使っている言語なので、他のサーバ環境よりは使いやすいはずですよね
>>211 Chromeは既存のV8のエンジン内でasm.jsのコードを高速に動かす最適化がかなり進んでる
Firefoxの場合はAOTの別エンジンで実行するから、コードの一部だけをasm.js化しても
オーバーヘッドの方がデカくなってしまう
ゲームみたいに全部asm.jsだと超高速に動くようになる
本当に「"use asm"」をターゲットに最適化をするTuboFunはまだChrome安定版で有効になっていないだろう。
現状asm.jsで早くなるのは汎用的な最適化によるもの。
型注釈だけでも速くなりそうな感じはするけど
223 :
Name_Not_Found:2015/02/22(日) 19:03:03.24 ID:1RosJE2U
可読性の質問はここで宜しいのでしょうか?
他言語→javascript初心者なのですが、記述方法がいろいろありすぎて困っております。
例えば
Web上に入力されたキャラクタの名前を取得したく、
初期実装が(id=character-name)の中身で今後は取得先の変更を考慮するとして、
const charname = (function getCharacterName(){return jQuery('#character-name').val();})();
const charname2 = (function(){return jQuery('#character-name').val();})();
const charname3 = jQuery('#character-name').val(); //入力から取得
const charname4 = getCharacterName(); //詳細は別で記述
上4つはすべて同じ処理を指定ますが、一般的、もしくはこれがわかりやすい、もしくは何もわかってない!というのはどれでしょうか?
あとconstはまだ使うべきではありませんか?
未消化のスレがあったのですね。失礼しました・・・
>>223 まず全体に言えること
> jQuery('#character-name')
ではなく $('#character-name') と書く方がいい。
理由はそのほうが短いから。
もう一つ。constは対応していないブラウザが多いから注意
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const > const charname = (function getCharacterName(){return jQuery('#character-name').val();})();
これは無駄な処理をしているだけ。一回しか使われない関数を作って呼び出してる。
> const charname2 = (function(){return jQuery('#character-name').val();})();
これも上と同じ。ただ関数に名前をつけてないだけ。
> const charname3 = jQuery('#character-name').val(); //入力から取得
問題なし。(ただし「全体に言えること」は除く)
> const charname4 = getCharacterName(); //詳細は別で記述
中身とどういう考えで関数にしたかによる。
中身が「return jQuery('#character-name').val()」だけであるなら
俺は多分関数にはしない。
226 :
Name_Not_Found:2015/02/22(日) 19:32:41.89 ID:tQwBICTX
class="human"の中のイメージを切り替えたいのですがうまくいきません
古典的なonとoffを切り替えるパターンです
$function() {
$("img[src*='_on']").addClass("current");
$(".human img").hover(function(){
if ($(this).attr("src")){
$(this).attr("src",$(this).attr("src").replace("_off.", "_on."));
}
},function(){
if ($(this).attr("src") && !$(this).hasClass("current") ){
$(this).attr("src",$(this).attr("src").replace("_on.", "_off."));
}
});
});
記述的におかしい部分はありますか?
ご指導いただければと思います
227 :
226:2015/02/22(日) 19:41:14.65 ID:???
すいません
&はjsファイル上では"&"です
よろしくお願いします
228 :
Name_Not_Found:2015/02/22(日) 19:44:49.56 ID:1RosJE2U
>>225 回答有難うございます
>$('#character-name')
こちらの環境(wordpress)で何故か$記述だとうまくいかなかったのでjQueryと記述してました。
単純に理解不足&設定ミスだと思われます。解決次第$で記述します。
処理に関しては将来的にデータベースから受け取ったり、他人がネットを介して入力した情報を何らかの方法で受け取ったりと
する可能性を考慮しております。複雑化した場合行数的には1〜20行程度の処理を想定しております。
1行で済ませされる間は変数名に気を使ってやれば
3の記述がすっきりしますね。constは外します。未来の自分がやらかさないか不安ではありますが・・・。
アウトラインの可能なエディタを使い、複数行化したら2に変更すれば良さそうですね。
別のところに記述するのはソース内ツリー化に対応してるエディタが増えてきている昨今だと
別の所で呼ばない以上離れて記述するのは意味なさそうですね。
ありがとうございました。
>>226 > 記述的におかしい部分はありますか?
$function() {
↑これ
230 :
226:2015/02/22(日) 20:06:43.71 ID:???
すいません
自分のことながら見た瞬間笑ってしまいました
書き直したのですがやっぱりうんともすんとも言いません
正直お手上げです
>>228 wordpressの使用忘れたけど、標準でjQuery入っていたはず。
使えないとしたら、wordpressが互換性のために、noConflictを使って
$を削除しているのだろう。そういう時は以下のようにすればOK
jQuery(function($) {
あなたのコードを全てこの中に書く
});
場合によってはこっちのほうがいいかもしれないけど
(function($) {
あなたのコードを全てこの中に書く
}(jQuery));
この二つは実行されるタイミングが違う。jQueryのready()とかを調べると良い。
> constは外します。未来の自分がやらかさないか不安ではありますが・・・。
外すのはいいけど、代わりにvarをつけるようにw
古いブラウザに対応する必要があるならこれ。
232 :
226:2015/02/22(日) 20:10:42.73 ID:???
今から外に出るので帰ったらjsdoに上げて見たいと思います
その間で変なところを見つけましたら修正してから上げますのでご指導お願いします
>>226 currentを何のために使いたいのかのかよくわからん。
先に細かい所を指摘しておくと、
$(".human img[src]").hover(function(){
と書けば、余計な
if ($(this).attr("src")){ がなくせる。
あと、attrの第二引数に関数を使えばもっとすっきりする。
$(function() {
$("img[src*='_on']").addClass("current");
$(".human img[src]").hover(function(){
$(this).attr("src", function(index, attr) { attr.replace("_off.", "_on.") });
}, function(){
if (!$(this).hasClass("current") ) {
$(this).attr("src", function(index, attr) { attr.replace("_off.", "_on.") });
}
});
});
とりあえず途中だが、ここまで書いてcurrentの使い方に違和感を覚えた。
>>232 じゃあ課題として、とりあえず
8000行まで減らしてみ。
JavaScript入門書を見ながらさ。
最小限の知識しか持ってないのがバレバレ
>>233に追記しておくと
違和感っていうのは、この例だとhover使わずに
mouseenterとmouseleaveに分けたほうが良さそうに見えるから
if ($(this).attr("src") と同じで、分ければ、下の
if (!$(this).hasClass("current") ) { はなくせる。
だがそもそも処理が対称になっていない。
対称でない処理はバグの可能性が高い。
もうひとつ言っておくわ。
あと、こういう画像切り替えは
一般的にsrc書き換えではなくCSSで行う。
JavaScriptではclassのみを変更し、
そしてCSS側でクラスに応じた画像を表示する
237 :
234:2015/02/22(日) 20:32:16.25 ID:???
jsdoって書いてたから他のやつと勘違いしたわ
すまんwww
238 :
226:2015/02/22(日) 20:49:22.53 ID:???
たくさんの指摘ありがとうございます
自分のなかでまとめた結果ですが
jqueryでの処理はクラスの付与、削除をメインに
CSSにてクラスの有無でdisplay: none;とdisplay: block;を切り替える
というやり方のほうが簡単そうですかね?
まだ出先ですので家に帰りましたらこのパターンで書いて見たいと思います
無知の初心者にアドバイスいただきありがとうございます
24時くらいまでスレを見れませんがアドバイスありましたらよろしくお願いします
俺もも用事があるからもうレスできんのだが、
ぶっちゃけ典型的な画像入れ替えならこれだけでいいはず。
$(function() {
$(".human img").hover(function(){
$(this).toggleClass("hover");
});
});
.human img { background-img: url('・・・_off.gif') }
// とするよりimg毎に画像違うから、#img1 とかになるはず
.human img.hover { background-img: url('・・・_on.gif') }
・・・・いやw 普通CSSだけでやるかw
JavaScript無し
.human img { background-img: url('・・・_off.gif') }
.human img:hover { background-img: url('・・・_on.gif') }
URLをCSSにずらずら書きたくないにしても、
onとoffを入れ替える関数(正規表現で一行でできるはず)を作れば
このレスの一番上に書いたコード + 1行でできるはずなんだよな。
必要もないのにjQueryを乱用するのはやめい
>>239 ここはjQueryスレじゃない。
消え失せろ。
なんかもうすぐ過去ログが見られなくなるという情報を見たのですが
過去のjsスレを検索したい時はどうすればいいんですか?
以前見た気がするから検索したいということもあるんですが
>>242 2chが西村以上の金の亡者に生まれ変わるので、過去ログはJIMという豚野郎
に金払わないと見られなくなります。おまけに専ブラも限定されます。
困ります
>>240 > 必要もないのにjQueryを乱用するのはやめい
必要かどうかを判断するのはお前じゃない。
自分のやり方を押し付けるな。
>>241 君がここで jQueryの話をさせたくないって必死なのはわかるが
君が来るまで、ここは平和に進行していたんだ。
荒らすような真似はやめてくれ。
せめて、jQueryを使わない実装でも書いてくれ。
君のレスは何の役にもたっていない。
>>245 >>246 字が読めなかったようだな
ここはjQueryスレじゃない。
消え失せろ。
やり方を押し付けるな?お前は全力でjQuery押し付けてるわけだが?
カス野郎
テンプレ見りゃわかると思うけどここは隔離スレみたいなもんだから
ライブラリの話はいいが、宣伝や説教は禁止な
ここは自由なスレだから
何も禁止じゃない
あえて言うなら禁止とか言うの禁止
禁止とか言うの禁止とか言うの禁止とか言うの禁止とか言うの禁止
嫌とかじゃなくて質問スレなんだから当然質問以外はご法度だし。
ライブラリの作法なんかの話題はスレチになる。
>>253 ちょっとまてw
回答もだめなのか?www
初期データに関してはajaxで読むのではなく
サーバで最初から埋め込んだ方がいいと本に書いてあったのですが
何故ですか?
処理がややこしくなるのでajaxで読んだ方がいいように思います
通信が1回分減るからじゃ?というか理由書いてなかったの?
もうhttp2の時代になっていくしバッドノウハウだよ。
scrollBy()で相対スクロールさせるところまで作れたんですが、
スクロールをスムーズにするにはどうしたらいいでしょうか?
ご教示お願い致します
>>255 > 処理がややこしくなるのでajaxで読んだ方がいいように思います
そこで処理がややこしくなると思う人は
アーキテクチャを考えられるレベルに来てないね。
初期データをajaxで読むか埋め込むか
どちらでも違いを意識しないような
作り方をすればいい。
それを考えるのがアーキテクトの仕事。
>>258 > スクロールをスムーズにするにはどうしたらいいでしょうか?
スクロールをスムーズにするっていうのが、アニメーションのことなら
標準のDOM APIにはそういう機能がないよ。
頑張りたい人(車輪の再発明)をしたい人なら自力で実装すればいいが、
まあ普通はjQueryのanimate()メソッドなどを使うね。
>>257 > もうhttp2の時代になっていくしバッドノウハウだよ。
確かに、IE11の時代に慣ればそうだが、
その時代は一体いつ来るんだ?
このスレを見てStrictモードを試してみるとエラーになったので書き換えようと思っているのですが
インライン関数(即時関数)の名前付けがどのあたりのブラウザからサポートしているか教えてください
> 確かに、IE11の時代に慣ればそうだが、
訂正。IE11がサポートしてるのはSDPY
HTTP2は将来的には問題を解決することができるかもしれんが
今すぐできる技術じゃないんで、現実的ではない。
ところで、Web作成にプロトコルの知識って必要なの?
サーバとブラウザでいい具合に調整してくれるんじゃないの?
>>265 その知識がないと、サーバーを選ぶことが出来ない。
カス野郎 と言いがかりをつけてライブラリ禁止を悪く見せようとする工作員さんお疲れ様です
>>261 その時代はいつかは来るだろう。
必要度が減少していっているものを新たに使わない、学ばないというのは原則。
seoを考えると、初期データ埋め込みどころか結果のhtmlをサーバで生成出来た方がいい
はい論破
江戸時代かっ
今はajaxの結果もきちんと拾ってくれるっつうのに
スレタイを鵜呑みにするなら、
jQueryもここで答えていいと思うんですけど
こっちの人が丁寧に答えてくれるよって誘導するのもありかもね
jQueryスレがあるのになぜ
>>273 え、まじで?
たしかにサーバサイドJSがもはや一般的だから
そんなことも出来そうだけど
そんな時代になってたか
サーバサイドJSとクローラのJS解釈に何の関係があるのか……
今のクローラっていうのはどちらかと言うとサーバでのスクレイピングというより自動化ブラウザに近い存在だぞ。
いや直接関係なくても無関係ではないだろ
>>260 ありがとうございます
scrollTopメソッドをanimeteする方法はわかりましたが、これをscrollByに転用するのがうまくできなかったので諦めす
>>274 そもそも、ライブラリはどこまで行っても簡単にする為のライブラリ。
それが1種類っていうならともかく、現在は山ほど出ているわけで、
jQueryで回答されるのは、迷惑なのだよ。jQueryわかってない奴に
とっては、余計なライブラリを読み込ませた上に、そこだけそんな
コードを押し付けられてるわけで。
他の奴の場合には、Prototype.jsで回答されましたなんてのが出てきた
りしたらもはや収集つかない。
この手の回答掲示板では、可能な限りライブラリを使わずにコードを書く
ことが定石。回答者の信奉してるライブラリだの書き方なんてのは、それ
こそ押し付けでしかない。
お前のそのどうでもいい長文の批判の方が迷惑なんだよ
まあなんともいえんな。
document.querySelectorAllでいいところにわざわざ$を使ってるのを見るとイラッとくるが、
document.querySelectorAllと書くのは煩わしい。
ひでえw
querySelectorAllでいいところにというが、
IE8では使えないわけで、俺にとっては毎回
(IE8では動かないコード)
querySelectorAll
と書いているようにしか見えないんだわ。
> querySelectorAllでいいところにというが、
> IE8では使えないわけで、
???
> querySelectorAllでいいところにというが
例えばこういうのは、querySelectorAllではダメな例。
$('.class').on('click', function() { });
普通にjquery使えよwww
ライブラリ拒絶してる人は、ライブラリを使わない回答をすればいい
そして質問者がどのコードが最もいいか判断すればいい
>>256 http://backbonejs.org/#FAQ-bootstrap Instead of firing an extra AJAX request to fetch them,
a nicer pattern is to have their data already bootstrapped into the page.
ナイサーなパターンと言っているだけで理由は書いてないようです
やはりリクエスト数が減るからでしょうか
最適化の質問です
var input = document.getElementById("input1");
console.log(input.value);
って言う書き方は遅いからvar a = input.value;みたいに別の変数に格納しろって話を効いたことがあるんですが
var a = {
ago: 10
}
console.log(a.ago);
これもvar b = a.goみたいに入れないとだめってことでしょうか?
>>294 えとさ、1マイクロ秒速くして
意味があると思ってる?
意味があるときだけやんなさい。
殆どの場合ないでしょ?
>>294 最適化するなら、可読性に対して最適化した方がいい。
どうせ速度を最適化した所で誰も得しない。
もうちょっと質問に寄り添った答にしろよw
>>294 一般論として速度のための最適化を人間の手でするべきではない
プログラム工程で一番重要なのはデバッグと保守なので、速度のために読みやすさを犠牲にしてはいけない
だから「入れないとだめ」って事はない
295や296の意見は正しい
ただこれはあくまで一般論で、最適化が重要になってくる局面もある
そういうレアケースに備えて話をするとドット演算子は遅いので、
オブジェクトで受けてやった方が良い
Hogeクラスのインスタンスを
Hogeインスタンスと呼ぶのは変ですか?
>>294 DOMでは「input.value」と何度も書くのであればキャッシュした方が早い。
JSの生オブジェクトでは自然とインラインキャッシュが働くので気にしなくていい。
また、ChromeではDOM実装もどんどんBlink-in-JS構想でJS化されていってるから、一部では自然と最適化が効く。
>>283 おまえみたいなROMってるだけのやつが、単発で書く内容のほうが
スレの邪魔だよ
>>292 誰も拒絶してない件についてwww
ここはjQueryのスレではない。ソレ以上でもソレ以下でもない。
jQueryで書く奴はお呼びではない。わかったか?
そのものの良し悪しは別にして批判も養護も多いと、単語自体が嫌われる
このスレにおいてjQueryは韓国と同じ
IE8だとDOMの値を取得すると重いし変数に入れるべきだろ
そもそも言語仕様の質問にリーディングの内容は関係ない
関数の頭の方で参照を保存して狭い範囲で使うならアリかな
>>301 お前が言いたいことはわかっている。
わかってないのはお前のほうだよ。
知ったことじゃない。質問者によって
それがいいことだと思えば、jQueryで書く。
質問者はjQueryを知らないが故にそういう
コードを書いているのかもしれないわけだから。
jQueryを使わないコードがほしいという人は、
そのように言うだろう。
>>303 > IE8だとDOMの値を取得すると重いし変数に入れるべきだろ
重いかどうかを判断するのはお前じゃない。
実行してみて数十ミリ秒以下のような体感できないほどの
短い時間の差しかでない処理なら、速くするためだけの
コードは必要ないだろうという言う俺の意見を参考に
質問者が決めればいいだけの話。
そもそもjquery否定厨が何でこのスレにいるんだよ
お前の仲間が立てた方のスレに籠っとけ
こっちはリベラルな方のスレだ
お前がいるとスレのクオリティが下がるんだよ
> お前がいるとスレのクオリティが下がるんだよ
願ったり叶ったりだw
>>298の質問に答えられる人はいないのでしょうか?
ものすごく変ではないが、多用される言い方ではない。でも意味は通じる。
もしくはHogeというクラスのインスタンスということを短く示したければhogeを使う。
>>298 W3C 仕様書とかだと「Hoge オブジェクト」は
「Hoge インターフェースを実装するオブジェクトのインスタンス」
の略である、みたいなことを書いてたりするから
「Hoge オブジェクト」が普通なのかな
まあインスタンスはオブジェクトだし
JSではクラスもオブジェクトじゃん
var Hoge = function(){};
Hogeオブジェクトというと、
コンストラクタとしての関数オブジェクトHogeのことなのか
Hogeのインスタンスなのかが分かりにくい
Hogeインスタンスというと一瞬で伝わる
JSではクラスもFunctionのインスタンスじゃん
var Hoge = new Function()
Hogeインスタンスというと、
コンストラクタとしての関数インスタンスHogeのことなのか
Hogeのインスタンスなのかが分かりにくい
fugaというと一瞬で伝わる
Hogeインスタンスという言い方はしないよ。
>>317 var a = new Hoge();
var b = {};
a=Hogeオブジェクト
b=オブジェクトb
プロトタイプベースはこの辺がややこしい
厳密にはクラスが無いし
うん。だからクラスがないからインスタンスという言い方もしない。
だからHogeオブジェクトになる。
ただし、Hogeオブジェクトをクラスにように使うことを想定している場合、
つまりnewを使って生成する場合、Hogeクラス(のようにみなして)
Hogeクラスのインスタンスを生成するという言い方をする。
クラスが無いというと語弊がある。
実体と抽象という関係のオブジェクトとクラスではないということだろう。
もしくは上から下の継承ではなく、下から上の譲渡という考え。
JSではコンストラクタによって作られるオブジェクトをインスタンスって呼ぶんだよ
インスタンスと呼ぶのはそのオブジェクトがnewで作られたものだけ
関数はFunctionクラスのインスタンスではないということ?
関数は通常Functionのインスタンスだけど、絶対そうであるとは限らないよ。
[[Call]]を持ってるオブジェクトなだけだから。
function Hoge() {
var cr = [Array, RegExp, Date, Number, String, Error];
return Object.create(cr[Math.random()*cr.length|0].prototype);
}
var hoge = new Hoge;
このhogeもHogeオブジェクトと呼ぶの?
なかなかトリッキーなの思いついたなw
普通に考えたら hoge instanceof Hoge が true になるかどうか、じゃないか?
言い換えれば、hoge のプロトタイプチェーンに Hoge.prototype が含まれているなら、hoge は Hoge のインスタンス。
なので
>>326の hoge は Hoge のインスタンスとは言えないだろう。
仕様書でも instance という単語はそういう意味で使われている
それはES5までのどうしようもない仕様だろ
ES6からは@@hasInstanceを使って何をインスタンスとするか自由に決められる。
「オブジェクト instanceof 関数」である必要もない
「プリミティブ instanceof オブジェクト」も許容されるよう改善された。
330 :
328:2015/02/25(水) 22:39:29.47 ID:???
うお、マジだった。恥ずかしい
>>328はなかったことにしてくれ
'str' instanceof String // false
なのもどうかと思ってたが
null instanceof Null // true
とか
x instanceof StringOrNumber
みたいなのもできるようになるな
もはやただの関数呼び出しだな
"prototype"に縛られずプロトタイプベースを謳歌しましょうということだろう
const Base = {
[Symbol.hasInstance](o) { return Object.getPrototypeOf(o) === this },
new() { return Object.create(this) }
};
const Vehicle = { __proto__: Base,
new(kind) { return Object.assign(super.new(), {kind}) }
};
const Car = { __proto__: Vehicle,
new(name, type, maker) { return Object.assign(super.new('Car'), {name, type, maker}) }
};
let car = new Car('CX-5', 'minivan', 'mazda'); //Object {kind: "Car", name: "CX-5", type: "minivan", maker: "mazda", new: function…}
car instanceof Car //true
webpackで出力されたjsファイルのデバッグに質問です
2つのjsファイルをwebpackにて一つのbundle.jsへとパックし、
devtoolオプションにてsource-mapを指定してソースマップを出力、
元のファイル構成が
app.js
foo.js
index.html
webpack後が
bundle.js
bundle.js.map
index.html
となり、ChromeでSettings -> General -> Enable JavaScript source mapsを有効化し、
index.htmlからbundle.jsをロードし、ソースマップから参照出来るパック前のapp.jsコード、foo.jsコードそれぞれにbreakpointを貼った所、
Chromeで再読み込みするとapp.js側のbreakpointが外れた状態でbreakpointが止まる為、再度の再読み込みをする前にbreakpointを貼り直す必要が出ています。
このような問題の解決方法はないでしょうか。
Chromeはバージョン 40.0.2214.115 m
webpackはgulp-webpack 1.2.0
です、ちなみにbrowserify 9.03でもbreakpointが上手く機能しませんでした。
336 :
335:2015/02/27(金) 06:11:55.91 ID:???
自己解決しました
ソースマップではなくdevtoolでevalを指定したらbreakpointが上手く機能しました
337 :
335:2015/02/27(金) 08:21:24.69 ID:???
経過報告です
その後ファイルを増やすとbreakpointを設定しているのに止まってくれない箇所が発生しました
ただ、あとは自力で解決してみようと思います、ありがとうございました
自動ログアウト処理のようなことを実装したいのですが、
同じドメインでのページ移動では何もしないのですが、
別ドメインへのページの移動、もしくはブラウザを閉じた時にイベントを発生させたいです。
unload系のイベントだと思いますが、そのような都合のいいことは出来ますか?
その仕組だとブラウザが不意に落ちた時などには対応しきれないだろう。
最も良い方法はServiceWorkerとセッションを結んでおき、切れたらログアウトさせること。
>>339 ありがとうございます。
ServiceWorkerは触ったことないので早速見てみます。
keypressでフォーム入力中にEnterを押したらフォームをクリアしたいのですが
this.value="";だとリセットされたあとに1回Enterが押されて改行された状態になってしまいます
form1.addEventListener("keypress", function(e){
if (e.keyCode==13){
this.value="";
}
},false);
どうしたら改行あかないようにできますか?
>>341 keypress が DOMが更新される前に生じるのが理由だろうから
DOMが更新された後のタイミングでリセットすればいいだろう
input イベントか keyup イベント( input イベントの後)
>>342 おー出来ました!ありがとうございます
こんなんでいいのかわかりませんが
form1.addEventListener("keypress", function(e){
if (e.keyCode==13){
this.addEventListener("keyup", function(){
this.value="";
}, false);
}
},false);
↑ちゃんとremoveしないとだめでした
変なコード晒してすみません
345 :
335:2015/02/27(金) 16:01:56.58 ID:???
取りあえずの解決策です
最終的にWebStormだとちゃんとbreakpointが機能しました、参考にしたurlです
https://github.com/webpack/webpack/issues/238 Chromeのデバッグ機能だと、
devtoolがevalはwebpackのrequireを使用したソースだとbreakpointが機能せず
devtoolがsource-map(とinline-source-map)だと2ソース以上でbreakpointを貼った際に1ソースのbreakpointしか機能しない
となった為、Chromeのデバッグ機能はまだ発展途上だと言う事で諦め、WebStormを使う事に落ち着きました。
innerHTMLで削除した場合子要素や子要素に設定されているイベントリスナもちゃんと削除してくれるんでしょうか?
Blinkでは弱参照で実装されているのでしかるべき時に消えますが、しかるべきでない時でも消える仕様バグが有ります。
>>346 前に似た質問したときは消さない親要素にリスナ付けてtarget判定入れろろって言われたな
jQuery ライブラリ 総合質問所 vol.4 から誘導されて来ました…
querySelectorAllで、sectionタグ下のimgタグは対象としたい。
→ document.querySelectorAll('section img')
しかし一方でsectionタグ下でもIDがexceptのdivに含まれるimgタグは除外したい
(section div#except img は対象外)。
このようなときにセレクタはどのように記述すればよいですか?
→ document.querySelectorAll('section img:not(section div#except img)')
では(案の定)ダメでした。
sectionの下のimgが必ず何らかのdivに囲まれてるとは限りません。
よろしくお願いします。
section>img, section div:not(#except) img
とか?
"abc".lastIndexOf("abc", 0);
と
"abc".lastIndexOf("abc", 2);
の結果が同じなんですけど、どうして前者は-1にならないんですか?
文字列の後方から検索して特定のインデックスより前に存在しないかどうやって確認したらいいですか?
"cba".indexOf("cba", 0);
"cba".indexOf("cba", 2);
じゃだめなのかね
"abc".split("").reverse().join("")
>>349 jQuery ライブラリ 総合質問所 vol.4でも書きましたが、
jQueryでいいなら
jQueryならこれでいいだろう。
$('section img').not('section div#except img')
ただ、IDは一個しか無いのが普通だから、これでいいはずだし、
$('section img').not('#except img')
exceptは普通幾つもありそうだからこっちのほうが良さそうだが
$('section img').not('.except img')
354 :
469:2015/03/01(日) 06:34:23.46 ID:V6oJr0+J
なーにわけわからないことやってるんだ。
document.querySelectorAll('section:not(#except) img')
だろ。
質問文をちゃんと嫁
>>354のようなjQuery以外方面だけに知識が偏っていて間違った回答なら無いほうがマシです
質問しても変な方向に切り返してきていちいち訂正するのが面倒くさいです
無視したら誠実さを疑われるのでスルーするわけにもいかないですし
たくさんの間違った知識で答える回答よりも確かな知識でjQueryで回答してくれる方が何倍も価値があります
css4になればあるいは
セレクタって正規表現つかえないんだっけ?
属性セレクタにってことか?
前方一致、後方一致、部分一致とかはあるけど、正規表現は無理
document.querySelectorAll('section *:not(#except) img')
で対応できるんじゃないの?
またjQueryの存亡をかけた自演チックな質問か。
jQueryがなきゃできないと誘導するための質問をあちこちに拡散して投じるというミエミエの工作なw
そんなもん、今はcontains()がIEだけのものじゃないから、誰でも簡単にフィルターできるんだよ、馬鹿が。
jQueryは終わってんだよ。いつまでも使ってんじゃねえよ、公害。
jQueryはVirtual DOMと競合するけど、readonlyで使う分には便利よ、
ただ使わないコードで肥大化するのは頂けないが
さんざんスレチだからライブラリスレ池言っといて
ライブラリスレ行っても同じ事やってる奴って一体なんなの?w
jqueryが終わってるなら何が使われてるんだよ
lodash
368 :
356:2015/03/01(日) 22:01:20.98 ID:???
>>362 >>356で言ったように、それは<section><div id="except"><div><img>にもマッチするので不可
>>363 自演と言われるのは心外だな。
自演でもないしjQueryを不必要に勧めているわけではない。既にあるjQueryでの回答が若干ズレてたので指摘しただけだ。
あと恥ずかしながら、.contains()を使う方法は知らなかった。できたらそれを使った方法を教えてくれるとありがたいが、可能だろうか?
DOM操作系はReact的なもの。
細かなAPIはポリフィルじゃね。
あとは従来通りにやるならAngelerか、
Polymerとか使ってそもそも作り方を大幅に変えるって手もある。
<section><div id="except"><div><img>にはマッチする〜とか言い出したらIDが複数ある場合とかいくらでも穴はあるでしょうに。
XPathを使え
>>369 > DOM操作系はReact的なもの。
ReactはDOM操作というより、フレームワークだから
HTMLページの一部にちょっとだけ取り入れたいって時に
不便なんだよな。ページ全体の再設計が必要になる。
将来的にはWeb Componentsでコンポーネントを作り
そのコンポーネント同士を結びつける(コンポーネント内部じゃなくてね)のに
DOM APIを使う。そのよりベターなAPIとして簡単に記述できるjQueryを
使うって方向に戻るんじゃないか?って思ってる。
>>371 こんな感じ?
var itr = document.evaluate('//section//img[not(section//div[@id="except"]//img)]',document,null,XPathResult.ANY_TYPE,null);
var res=[];while(e=ret.iterateNext()){a.push(e);};
>>372 要するにAngeler.jsに入っているようなjQueryのミニマムサブセットがいいんじゃないの?
ちょっと取り入れたいだけなら別もそれも要らなくて、自前で関数数個書けばいいだけと思うけど。
> 自前で関数数個書けばいいだけと思うけど。
あれこれ、自前で関数作っていくと、
jQueryでいいんじゃね?ってことになるんだよ。
>>374 もちろんあんたがそうであることまで否定したりはしないよ。
でも今はちょっとだけ何かがほしい時大きなライブラリは不便っていう一般的な話をしているんだよ。
>>375 だから大きなフレームワークの導入じゃなくて、jQueryのような小さな
ライブラリを使おうって話をしているんだが。
jQuery厨はそれがあるのが当たり前と思ってるからまともに話しても無駄
だから隔離スレができたというのに
圧縮して100KBあるライブラリが小さいとよ
ふざけるのもいいかげんにしろ
>>378 圧縮とミニファイの区別をつけてくれ。
古いブラウザにも対応した、jquery-1.11.2.min.js で94KB
最新だけで良ければ、jquery-2.1.3.min.js で83KB
これはミニファイで、圧縮した状態なら32.6KB
jquery-2.1.3.min.js 29KB だよ。
もちろんキャッシュが効くから、最初の一回目にしか転送は必要にならないし、
GoogleなどのCDNが使えるから、速くてサーバーの負担にもならない。
ライブラリを使って、最初の一回ですませるか、
本質的なコードの量を削減して転送量を減らすか。
ライブラリを使わずに、長いコードを書いて
転送量を増やすかの違い。
反jquery厨は
単に自分もjqueryじゃない回答も書けばいいだけだろ
質問者にしてみればいろんなケースの回答があった方が便利なのは当たり前
はい論破
ライブラリ許容のこちらは隔離スレだから相手にするだけ無駄
意味不明w
便利なスレの方が隔離スレかよ
不便なスレ方が隔離されてるだろ常識で考えて
ライブラリを他人に押し付けるのは隔離スレにおいても便利なことではない。
誰の得にもならない愚行だよ。
隔離スレの存在意義は、質問者がライブラリを使用した回答を期待している場合と、
多少のライブラリの良し悪しについての雑談のため。
布教は誇示は対象外だから他所でやってくれ。
押しつけって何のこと言ってるんだ??
どうやったら押しつけられるんだよ
超能力者かよ
ライブラリの話題が出ようが、使うも使わないも自由
当たり前のことだろ
書くも書かかないも自由だし使うも使わないも自由
簡単なことです
変化の激しい分野で標準でもない一つのライブラリにフォーカス当て続けるのも危険だよ
現にVirtualDOMと競合してるわ、よりコンパクトなlodashの利用に移ってるわで縮小傾向にある
過去の資産が多いか利用者が多いのならそれが選択の一つにはなると思うがjQueryは
資産も多いし利用者も多いし実際便利だから使っても良いなと思いました
バーチャルドムってDOM操作を最小限にする技術だろ?
jqueryとはまた別じゃないの
勉強が足りんな。
というか想像力がない。
jQuery前提の設計思考ばかりしてるとこうなるんだな。
こわっ
メモリ上のDOM構造(以下仮想DOM)に、新しい仮想DOMが来たら差分だけを実際のDOM(以下本DOM)としてブラウザ側へ書き出すって仕組みだから、
ブラウザ側で本DOMを操作するとメモリ上の仮想DOMとずれてしまい上手く差分書き出しが出来なくなるのよ。
jQueryは本DOMを操作するライブラリだから、操作自体がVirtualDOMと競合してしまい併用が出来なくなる。
あと、VirtualDOMにしたからと言って仮想DOM構築にはコストかかるよ、
まあブラウザ側の本DOM構築コストよりは遥かに安いから気にしなくても良くなるけど。
一応ReactにはshouldComponentUpdateっていう仮想DOMの再構築をするかの判定メソッドを使ってさらにチューニング出来る。
でも、たとえばあるコンテンツを含む領域のサイズとかって
実際に表示してみないと計測できなくない?
ブラウザごとに変わる可能性あるから。
バーチャルドムはそのへんどうしてるんだろ
>>390 それどころか通常のDOM APIも併用できないよ。
React使うなら、React経由でしかDOMをい
じれないと思った方がいい。
<div id="hoge">hogehogehogehoge</div>
var width = $('#hoge').width();
をバーチャルドムでできるの?
個人的にはHandlebars等でレンダリング部分をtemplateファイルに切り出せてたのが好みだった、これでもそこそこ速いし
Reactは構造上一つのクラスでView・Controllerを持つから、クラスの肥大化を防ぐのがユーザの手に委ねられたのが開発時に気を付けたい所
>>394 componentDid(Update | Mound)でjQueryで取得しても良いし、
Reactの作りに従って
render: function() {
var width = this.hogeTxt.length;
return ( <div id="hoge">{this.hogeTxt}</div> );
}
としても良い、最適化するならjQueryは毎回のselectorが冗長かつ重いからReact風にした方が良いかも
Reactって130KBもあるのか。(´・ω・`)
jQueryなら83KBでいいのに
アプリの規模やパフォーマンスで決めてけば良いんじゃないかな、
小規模でReactはFramework部分の記述率が多い印象、
逆に規模大きくなるとjQueryだけだとカバーしきれないから今までもBackbone(& Marionette)やKnockoutを使うようになってたし
それはウェブアプリを作る場合だよね。
ウェブサイトやウェブページに使うぐらいなら
jQueryで十分だと思う。
サイトでFramework系はオーバーワークだね、そこならjQueryでも十分だし、Vueも良いと思う
>それは<section><div id="except"><div><img>にもマッチするので不可
っていってるけど
>>356=
>>349なの?
>>349の条件はそれが不可なんて言ってないと思うんだけど
途中でおくってもうた
・sectionタグの中のimgが対象である
・div id="except"中のimgは除外する
・全てのimgがdivに囲まれているわけではない(他の要素に囲まれてるとは言っていない)
つまり><section><div id="except"><div><img>
これは条件に合致してると思うのだけど
もういいよ。
質問者も解決できたでしょ。
virtualdomとjqueryどっちが速いの?
同じVirtual DOM実装のMercuryやElmが圧倒的なんですがそれは
なんか聞いたことのないライブラリが沢山あるんだな・・・・
どう考えてもライブラリの話題禁止とか言ってる場合じゃない
時代に取り残されるわ
ライブラリというかフレームワークの部類だし、
全くライブラリらしい物から、ES7やHTML.nextで標準に入りそうな機能の物まで挙がってるし話は複雑だよ。
今のいろんな機能はライブラリを元に書かれることも多いしね。
そうなればライブラリというよりただ先行実装版やポリフィルを使ってますということになる。
ただし時が流れ標準のほうが熟成してくるとライブラリが取り残されることになる。
今その状況なのがjQuery。
去年XPの延長サポートが終わりIE8が消えていく時代だしね
2017年にはVistaのサポートが終わってIE9も切れる
jQueryどころかDOM APIすら使わない時代なんだよな。
このスレの意味が無いw
フレームワークを使うと、作り方が全く変わってくるからね。
ウェブサイトの作り方じゃない。
ウェブアプリを作るならそれでもいいけど、
いわゆるホームページ+α的なものだとやり過ぎ。
だから、
ウェブアプリ=フレームワークを使う(jQueryもDOM APIも使わない)
ウェブサイト=jQueryを使う。
の二極化していくんじゃないかな?
フレームワーク or jQuery
どちらにしろDOM APIはもう使わないよ。
virtualdomって要するに
HTMLの差分を計算して勝手に適用してくれるのか
>>411 ゲームに例えればわかりやすいよ。
ゲームは一秒間に30フレームだとか
60フレームだとか毎回画面を書き換えている。
毎回書き換えて処理速度大丈夫なのか?って思うかもしれないが、
それを減らすために、書き換える必要があるところだけ書き換えてる。
そのゲームで使われていた技術を持ち込んだのがVirtualDOM
クローラーに引っかかることが重要ではない
ウェブアプリならその方法でいいんだけどな。
例えばWikipediaのようなサイトにVirtualDOMは
似合わないかな。そもそもそこまでJavaScript必要じゃないし。
たいていの情報系サイトはそうじゃないかな?
今時のクローラはJS実行後の画面を取得できるって
このスレで見たよ
クローラーってのはGoogleだけじゃないかなねぇ
418 :
Name_Not_Found:2015/03/03(火) 02:13:23.90 ID:fuflqn7b
>>418 ワロタw
「健康が悪い人の9割は一週間以内にパンを食べていた」
「犯罪者の9割は一週間以内にパンを食べていた」
みたいなネタをリアルでやってるw
結果は置いといて、これはちゃんと対比実験になってるから科学として正当だよ。
その前に何目的でこんな書き込みをしたのか
ネトウヨみたいに洗脳されてそう
人類は皆ミームによって突き動かされてる。
正規表現について質問です
マッチ対象のグループ化数が不明の時に、正規表現によってグループ一覧を取得する方法はないでしょうか
例えば、
matches = "aaaBBBaaaBBB".match(/(([a-z]+) | ([A-Z]+))/)
としたら、
["aaa", "BBB", "aaa", "BBB"]
という結果を取り出したいです
時計に合わせて10分間隔で通知を出すタイマーを作りたいのですが設計をどうすればいいでしょうか
例えば11時3分にタイマーをスタートしたら11:10 11:20 と通知を出したいのです。
(window.alert は使いません)
今考えてるのは↓これなんですがアドバイスお願いします。
開始ボタン
↓
直近の10分までsetTimeout
↓
10分間隔でsetInterval
>>423 /([a-z]+|[A-Z]+)/g
>>424 ブラウザのタイマーを信用するならそれでいい。
>>423 var matches = "aaaBBBaaaBBB".split(/([a-z]+)/);
→[ '', 'aaa', 'BBB', 'aaa', 'BBB' ]
空文字列が出ちゃうな
まぁfilterに掛けるなりすればいいし、そんな感じでやればいいと思う
>>423 gフラグ
match(/regex/g)
>>424 動けばなんでもいいんじゃね
まぁちょっとずつずれるし
10分おきに時間計算しなおしてsetTimeoutしなおしたほうがいいんじゃね
428 :
423:2015/03/05(木) 18:00:21.18 ID:???
自己解決しました
力技ですが、下記のようにorマッチ部分を分解して、再帰的にいずれかのマッチ結果を取り出すにして対応出来ました
// CoffeeScript
str = 'aaaBBBaaaBBB'
a = []
while true
matched = str.match(/^([a-z]+)(.*)/)
if (matched)
a.push(matched[0])
str = matched[1]
continue
matched = str.match(/^([A-Z]+)(.*)/)
if (match)
a.push(matched[0])
str = matched[1]
continue
break # マッチ完了
console.log(a) # ['aaa', 'BBB', 'aaa', 'BBB']
430 :
424:2015/03/05(木) 18:02:11.49 ID:???
>>425>>427 ありがとうこざいます!
全部setTimeoutの方が楽そうなのでとりあえずそっちでやってみます
動けばいいといっても限度がある
流石に
>>428みたいなのは解決とは呼べない
432 :
423:2015/03/06(金) 00:51:48.11 ID:???
>>431 おっしゃる通りです、最終的に/gを付けて解決する事が出来ました
433 :
424:2015/03/06(金) 02:07:38.77 ID:???
すいません。10分後までの秒数を調べる方法教えてください > <
>>433 600秒-《現在時刻の分の1の位》*60-《現在時刻の秒》
ちっとは頭使え。
436 :
424:2015/03/06(金) 14:31:17.52 ID:???
小学低学年でも分かる算数だろ……
プログラミングってのは算数からは逃げられないぜ。
>>436 条件分岐6個に興味があるんだけど、
どんなアルゴリズムを思い付いたんだ?
さすがに条件分岐6個はあれだけど、[10, 20, 30, 40, 50, 60] のようなテーブルを用意して
ってのは有りだと思う
正時から10分ごとっていう仕様が変わらなければ一つの計算で出してもいいけど
>>438 if (分 == 0) {}
if (分 == 10) {}
if (分 == 20) {}
if (分 == 30) {}
if (分 == 40) {}
if (分 == 50) {}
だろ?
>>437 プログラミングには、算数は小学生レベルでいいけど、語学力と歴史学は修士レベルが必要だよ。
歴史学はいらんだろw
ロジカルシンキングが得意であったほうがいい
算数と言うより数学の方だな
英語は公式のドキュメント読む時は必須
いつも思うが、数学というか、
ロジカルシンキングがあればいいだろ。
プログラミングに必要なのは美的センス
>>445 それはそうなんだが絵的な美的感覚とも違うんだよな
論理性の美しさって言うか問題解決の簡潔さや無駄の無さ