5ちゃんねる ★スマホ版★ ■掲示板に戻る■ 全部 1- 最新50  

■ このスレッドは過去ログ倉庫に格納されています

+ JavaScript の質問用スレッド vol.93 +

1 :Name_Not_Found:2011/12/10(土) 15:34:47.36 ID:???
JavaScript を自ら学ぶ人のための質問スレッドです。
>>2-4のテンプレを読んだ上で質問してください。

■質問を書く上で
(1) 質問にならない投稿はご遠慮ください。(煽り、コード制作依頼など)
(2) 他の人に迷惑をかけるスクリプトの質問はご遠慮ください。
  (ブラクラ、[戻る], [閉じる], [クリック] の妨害、画面占有など)
(3) 長い間連続して質問する場合にレス番を名前にしてあれば、質問の流れが回答者に伝わりやすくなります。
(4) 常に自発的に調べる心構えを持ってください。
  具体的には「自分で調べてから質問する」「回答をもらってわからない単語があればGoogle検索してみる」など。
  わからない内容を代わりに調べてくれる回答者をお望みの方は余所で質問してください。
(5) 出来るだけ一般的な用語を使用してください。脳内オレオレ用語は混乱の元です。
(6) 出来るだけサンプルコードを掲示してください。言葉による説明は行き違いが生まれる場合があります。
  ※必ず「問題の事象が再現されること」を確認してください。
   必要な部分だけ切り出したつもりで現象が再現できていなかったケアレスミスがしばしば見られます。
(7) サンプルコードに HTML が含まれる場合は http://validator.w3.org/ で [Check] してみてください。
(8) 質問を具体的かつ詳細に書くと回答を得られやすいです。質問テンプレートを活用してみてください。

■質問テンプレート
【環境】OS, ブラウザをバージョンと共に記入してください。(ex: IE8, Firefox4)
【何をしたのか】何をしたら問題の現象が発生するのか。再現手順を具体的に書いてください。
【エラーメッセージ】エラーメッセージがあれば正確に書き写してください。(Windows なら「コピット」を活用)
【期待する結果】最終的にどういう結果を望んでいるのか、を書いてください。
【サンプルコード】現象を再現可能な最小限のコードを書いてください。
 1レスに収まらないならコード投稿サイトを利用してください。
 http://jsdo.it/ http://jsbin.com/ http://jsfiddle.net/ http://ideone.com/

2 :Name_Not_Found:2011/12/10(土) 15:36:30.70 ID:???
■前スレ
+ JavaScript の質問用スレッド vol.93 + (本来はvol.92)
http://hibari.2ch.net/test/read.cgi/hp/1321414111/

■過去スレ全集
http://www2.atpages.jp/mirror/2ch/javascript/
http://usamimi.info/~mirrorhenkan/2ch/javascript/ (閲覧のみ)
http://wing2.jp/~mirrorhenkan/2ch/javascript/ (閲覧のみ)

■関連スレ
ECMAScript デス 3
http://hibari.2ch.net/test/read.cgi/tech/1190160481/
Ajaxでも語りませんか Rigel4
http://hibari.2ch.net/test/read.cgi/php/1166751613/
1行javascriptプログラミング
http://hibari.2ch.net/test/read.cgi/hp/1066750037/
WSH(・∀・)スレッド! Part 4
http://hibari.2ch.net/test/read.cgi/tech/1243095768/
Webサイト制作初心者用質問スレ part227
http://hibari.2ch.net/test/read.cgi/hp/1322905086/
CSS初心者スレッド=10th=
http://hibari.2ch.net/test/read.cgi/hp/1306489752/

3 :Name_Not_Found:2011/12/10(土) 15:37:49.70 ID:???
■主要FAQ (全部は http://fiddle.jshell.net/vSqKr/27/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 中でやるとか。

4 :Name_Not_Found:2011/12/10(土) 15:39:01.54 ID:???
■各種仕様
Standard ECMA-262
http://www.ecma-international.org/publications/standards/ECMA-262.HTM
ECMAScript 3
http://www2u.biglobe.ne.jp/~oz-07ams/prog/ecma262r3/ (和訳)
ECMAScript 5.1
http://es5.github.com/
W3C Document Object Model Technical Reports
http://www.w3.org/DOM/DOMTR
JavaScript 1.5 ガイド / リファレンス (Netscape/Mozilla)
http://developer.mozilla.org/ja/docs/Core_JavaScript_1.5_Guide (和訳)
http://developer.mozilla.org/ja/docs/Core_JavaScript_1.5_Reference (和訳)
JavaScript Garden (ja)
http://bonsaiden.github.com/JavaScript-Garden/ja/
JSON (JavaScript Object Notation)
http://www.json.org/json-ja.html
http://jsgt.org/ajax/ref/test/json/test1.htm
Mozilla Gecko DOM Reference, Netscape devedge
http://developer.mozilla.org/ja/docs/Gecko_DOM_Reference (和訳)
http://devedge-temp.mozilla.org/central/javascript/index_en.html
MSDN Library JScript / DHTML (現在日本語版は古杉)
http://msdn.microsoft.com/ja-jp/library/z688wt03%28VS.80%29.aspx
http://msdn.microsoft.com/ja-jp/library/cc409720.aspx

5 :Name_Not_Found:2011/12/10(土) 23:24:21.44 ID:???
>>4
乙。次スレは http://jsgt.org/ajax/ref/test/json/test1.htm を削除してね。

6 :Name_Not_Found:2011/12/11(日) 02:27:47.90 ID:???
<a href="javascript:document.photo.src = 'img/item/hoge1.jpg'; void(0);">

あるサイトのソースを見ていたら、このようなコードを発見したんですが
この書き方って一般的によく使われているんですか?オンクリックイベントを書くより楽そうですね

7 :Name_Not_Found:2011/12/11(日) 02:33:40.83 ID:???
古い書き方なのでおすすめしない


8 :Name_Not_Found:2011/12/11(日) 04:47:41.32 ID:???
disabled selected checkedなどの値が無いプロパティをセットする場合
option.selected = true;
option.setAttribute('selected','');
option.setAttribute('selected','selected'); //XHTML
などの方法がありますが、どの方法でいくのが無難でしょうか?

9 :Name_Not_Found:2011/12/11(日) 05:17:07.97 ID:???
更に以下も追加
option.setAttribute('selected','true');
option.setAttribute('selected',true);
どの指定の仕方が正しく、どの指定の仕方が互換性が高いのか分かりません

10 :Name_Not_Found:2011/12/11(日) 05:28:11.70 ID:???
option.setAttribute('selected', 'selected') でDOM操作すると狂うから
option.selected = true を使った方が良い

一者択一の属性値だから、それ以外の3つのやり方はおかしい
HTMLに書くときは、属性値が無いわけじゃなく、SGMLの省略タグ機構で属性名の方を省略してる

11 :Name_Not_Found:2011/12/11(日) 05:56:39.13 ID:???
jQuery UI のdialogで、iframe方式で別ページを指定して表示した時、
そのdialogの別ページ内のイベントから、呼び出し元のページのDOM要素を操作したい場合は
どうしたらいいでしょうか?

12 :Name_Not_Found:2011/12/11(日) 07:02:09.25 ID:???
jsでシンセ作ったぜ〜

http://www42.atwiki.jp/syugyou?cmd=upload&act=open&pageid=250&file=oto2.html

13 :Name_Not_Found:2011/12/11(日) 08:43:37.27 ID:???
>>10
ありがとうございます ずっとひっかかっていたものがとけました

14 :Name_Not_Found:2011/12/11(日) 18:58:15.79 ID:IeRT93jj
>>12
エンベロープつけろや

15 :Name_Not_Found:2011/12/11(日) 19:47:52.42 ID:O05++akw
function append(arg){
if(typeof arg==="String"){
this.innerHTML=elms;
}else{
var df = document.createDocumentFragment();
for(var i=0, l=arguments.length; i<l; i++){
df.appendChild(arguments[i]);
}
this.appendChild(df);
}
}

上記のようなthisとしてバインドされたHTML要素に対して
要素の追加を行う関数をつくろうと思っています。

関数の引数がstringであれば、それをinnerHTMLでthisに流し込み、
document.createElement()などで作成されたHTML要素が引数にきたら
appendChildでthisに追加するようにしたいのですが、
後者の処理の前に 「引数がHTML要素かどうか」 を判定したいのですが、
どうしたらうまくそのような判定ができるでしょうか?


16 :Name_Not_Found:2011/12/11(日) 19:51:34.93 ID:???
エレメントノードだけがほしいなら
arg.nodeType===1
でいいんじゃねすか

17 :Name_Not_Found:2011/12/11(日) 21:04:57.69 ID:???
>>15
テキストノードとかコメントノードとか、要素ノード以外はどうするの

18 :Name_Not_Found:2011/12/11(日) 21:18:26.69 ID:O05++akw
>>16
ありがとうございます
nodeタイプでいけそうな感じはしますね
クローンノードも欲しいので、そのnodetypeも判定条件にいれてやればうまくいくかな・・・

>>17
df.appendChild で追加できるものであれば・・・と思いましたが
テキストノードなんかもappendChildで追加できるんですかね?
とりあえずは要素ノード、クローンノード、documentFragmentノードあれば十分かなぁという感じです

19 :Name_Not_Found:2011/12/11(日) 21:53:30.58 ID:???
>>11で思ったんだけど、jQuery UIって皆使ってるもん?
そんなメジャーになった?全く触れてないんだけど

20 :Name_Not_Found:2011/12/11(日) 23:25:22.11 ID:???
>>12
あんたがスゲーのはもうわかったよ
だけどそこダウンロードしなきゃ実行できねえんだよ
なんとかしろよ

21 :Name_Not_Found:2011/12/11(日) 23:26:31.51 ID:???
せめてHTMLとしてうpってくれ

22 :Name_Not_Found:2011/12/12(月) 00:02:58.25 ID:pENH4A4b
$("a").onclick(function(){
//ここでのthisと$(this)ってそれぞれ何が入ってるんですか?
})
全く見当違いな質問だったらごめんなさい

23 :Name_Not_Found:2011/12/12(月) 01:07:32.39 ID:???
HTMLAudioElementか

24 :Name_Not_Found:2011/12/12(月) 01:10:52.10 ID:???
チョー解りやすく言うと
<a>全体じゃなくてそのクリックされた部分だけの<a>

25 :Name_Not_Found:2011/12/12(月) 01:15:43.72 ID:???
>>18
DOMにはクローンノードというnodeTypeはない
www.w3.org/TR/DOM-Level-3-Core/core.html

26 :Name_Not_Found:2011/12/12(月) 05:33:34.06 ID:???
http://www.dotup.org/uploda/www.dotup.org2371311.jpg

$('#a')の位置を取得する時左の場合は$('#a').position().topで20pxと出来るのですが
右のように要素をスクロールしたら-30pxとかになってしまいます
スクロールしてもその要素の上からの位置を取得するのに良い方法とかありますでしょうか?

27 :Name_Not_Found:2011/12/12(月) 07:23:10.55 ID:???
>>26
$("#a").offset().top;

28 :26:2011/12/12(月) 07:42:22.22 ID:???
>>27
すみません・・・、$("#a").offset().top;だとbody上での位置になってしまうんです

29 :26:2011/12/12(月) 07:48:07.18 ID:???
<body>白い部分
   <div id="g">水色の部分
      <div id="a">赤い部分
      </div>
   </div>
</body>

こんな感じです

30 :Name_Not_Found:2011/12/12(月) 12:16:38.86 ID:???
昔はHTMLうpったらそのまま開けてたけど今そーゆーロダないのな

31 :Name_Not_Found:2011/12/12(月) 12:23:41.56 ID:???
>>30
そりゃ、いろんなものの温床になるからでしょ。

32 :Name_Not_Found:2011/12/12(月) 13:05:11.05 ID:???
dropboxは?

33 :Name_Not_Found:2011/12/12(月) 13:14:29.30 ID:???
jsfiddleとかjsbinとか>>1にあるが

34 :Name_Not_Found:2011/12/12(月) 14:53:00.69 ID:rE3ZKdoB
>>28
スクロール量もとれるじゃろ

35 :Name_Not_Found:2011/12/12(月) 17:57:51.35 ID:???
前スレ995でスレ立ての相談をした者です。

http://hibari.2ch.net/test/read.cgi/hp/1321414111/
995 Name_Not_Found sage 2011/12/11(日) 07:05:15.41 ID:???
すいません。JS関連でスレ立てをお願いしたいのですが、どこに頼むべきでしょうか?
運営とは違うようですし・・・

999 Name_Not_Found sage New! 2011/12/11(日) 12:13:20.35 ID:???
まずスレタイと内容を書いてみてください

----------

ということなので、下記の内容を希望します。

(仮)【JSで】 SVG描画ライブラリRaphael(ラファエル) 【ベクター描画】  ←仮タイトル

・・・本文は次レスにて


36 :35:2011/12/12(月) 17:59:33.32 ID:???
HTML5のSVG描画(ベクター描画)を可能にするJavaScriptグラフィックスライブラリ。
現在バージョンは2.0.1。 MITライセンスなので誰でも自由に利用可能。
※SVG(Scalable Vector Graphics)

本家HP http://raphaeljs.com/ (注: リファレンスも全文英語)

JSで動くSVG版Flashのような存在。 HTML5のCanvasに比べインタラクティブ動作に強い。
記述は基本的にタグが不要で、マウス操作やアニメーションも可能。

サポート中のブラウザは、Firefox 3.0+,Safari 3.0+,Chrome 5.0+,Opera 9.5+ 及び Internet Explorer 6.0+。
ただしIE6〜8はVML(Vector Markup Language)で描画。 iOSでも動く。

【始めるには】
http://libro.tuyano.com/index3?id=101001
http://www.skuare.net/test/raphael_1.html
http://112123.jugem.jp/?eid=2606
http://y2-space.com/blog/it-skil/programing/javascript/267/

【お役立ちリンク ※全て英語】
http://stackoverflow.com/
http://groups.google.com/group/raphaeljs
http://www.irunmywebsite.com/raphael/additionalhelp.php?v=2#pagetop
http://craic.com/tutorials/javascript/raphael_live/raphael_live.html
http://jsfiddle.net/ 左側でRaphael2.0を選択

=== 補足 ===
・ビジュアル系バンドに同名のRaphaelがあるので検索に注意。
 コッチのRaphaelを参照するには JavaScript とか JS とか SVG を検索欄に追加すればOK。
・ jQueryとの対比 http://stackoverflow.com/questions/588718/jquery-svg-vs-raphael


37 :Name_Not_Found:2011/12/12(月) 18:09:04.24 ID:???
SVGスレでいいんでないの

38 :35&36:2011/12/12(月) 18:41:06.58 ID:???
>>37
SVGスレってあったんだ。でもRaphaelは従来のタグによる記述ではなくて
JSコードそのもので挙動をしています(JSの正規表現も普通に使えます)。

一応、【XML】SVGってどうなの2【DOM】を見たけどコーディングにJSは殆ど関係なさそうです。


39 :Name_Not_Found:2011/12/12(月) 18:55:34.47 ID:???
SVGはXMLなんだしもともとJavascript使ってDOM操作もするもんでしょ
SVGスレ内にもJS+DOMの話があるじゃない
どうせ過疎る汎用性のないスレを乱造せずに既存のスレを活用しよう

40 :Name_Not_Found:2011/12/12(月) 19:49:00.93 ID:???
質問させてもらいます

pのclass=typoe1の指定は
$("p.type1")ですが
id=typeDの中にあるclass=type1の指定なども出来るのでしょうか?

41 :Name_Not_Found:2011/12/12(月) 19:51:59.73 ID:???
$("#typeD .type1")
というかほぼCSSの質問じゃないか

42 :Name_Not_Found:2011/12/12(月) 19:57:51.29 ID:???
>>41
ごめんなさい、1日中
$("#typeD,.type1")や$($("#typeD").(".type1"))で試してた自分が馬鹿でした

43 :Name_Not_Found:2011/12/12(月) 19:59:15.18 ID:???
スペース空けてなかったと予想

44 :Name_Not_Found:2011/12/12(月) 20:02:18.14 ID:???
>>40
jQueryクックブック買えば。勉強になるよ。

45 :Name_Not_Found:2011/12/12(月) 20:06:12.63 ID:???
>>44
Javascript入門書は買ってそれの1/3位jQuery載ってたので使ってる感じです
ライブラリについての本とかもあるんですか、何か不思議ですね

46 :Name_Not_Found:2011/12/12(月) 20:15:32.32 ID:???
情報系の学部なんてjpegの圧縮について研究したり学んだりするんだぞ
数学なんて一人の天才が考えた数式について何十年も研究してるし

47 :Name_Not_Found:2011/12/12(月) 20:21:52.27 ID:???
真面目にやってる奴なんてどれ程いるのか謎だけどな

48 :Name_Not_Found:2011/12/12(月) 20:34:12.42 ID:???
なぜそういう流れに

49 :Name_Not_Found:2011/12/12(月) 22:06:20.36 ID:rE3ZKdoB
>>46
突然どうしたw
でもエクセルでJPEGの実験したの思い出して懐かしくなった

50 :Name_Not_Found:2011/12/13(火) 00:33:11.26 ID:???
テスト


51 :Name_Not_Found:2011/12/13(火) 00:57:37.70 ID:???
JSONの質問
var person={"first-name":"Jerome"};
のようにプロパティ名の文字列はダブルクォテーションで囲む
決まりがありますが、Javascript The Good Partsによると
プロパティ名がJSの名前に則っているときは省略可能とあります。
first_nameなら"が省略可能で
var person={first_name:"Jerome"};となるますが、以前ここにプロパティ
名の"をつけず書きこむと、JSONではないと言われましたが、これも
JSONなんですね。Ajaxなどのときは、プロパティ名の"は省略可能な
時は省略するのでしょうか?それとも会社によって"が省略するかどうか
細かな規約があるのでしょうか?

52 :Name_Not_Found:2011/12/13(火) 01:10:14.50 ID:???
JSONとJavaScriptのオブジェクトは別
JSONにもちゃんと仕様がある
GoodPartsで書かれてるのは
多分JavaScriptのオブジェクトを記述する時の事で
JSONについてではない

JSONの仕様
http://www.ietf.org/rfc/rfc4627

19 KB
■ このスレッドは過去ログ倉庫に格納されています

★スマホ版★ 掲示板に戻る 全部 前100 次100 最新50

read.cgi ver 05.04.00 2017/10/04 Walang Kapalit ★
FOX ★ DSO(Dynamic Shared Object)