javascriptについて

解決済

質問者：artemis--r
質問日時：2011/08/25 23:09
回答数：4件

よろしくお願いします。

javascriptで○×形式のクイズのようなもの（診断テストのようなもの）
を作りたいと思っています。
・・・が、恥ずかしながら私はプログラミング初心者です。

どのくらい初心者かというとＨＴＭＬの基礎が分かっていて、タグを調べながら
ＨＴＭＬであればwebページが作れるかな。ってくらいの初心者です。。。
javascriptで作りたいページというのは、自分に当てはまるかどうか、
○か×かで答えていき、最後に診断が出る。。。というようなページです。

「javascript 入門　初心者」などのキーワードでgoogleで検索して、
インターネットで独学で勉強はしているのですが、あまり分かりません。。。

これくらいのレベルの私が見て勉強しやすいようなページってありますか？
また、勉強するのに、コツとか、理解しやすい勉強法ってありますでしょうか？

また、上記の診断テストについて、「こういう記述したらいいんじゃない？」
ってサンプルを教えてくれる方がいらっしゃいましたら、教えていただけたら大変嬉しいです。

お手数ですが、よろしくお願いします。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (4件)

ベストアンサー優先
最新から表示
回答順に表示

No.3ベストアンサー

回答者： babu_baboo
回答日時：2011/08/27 04:37

ぜんかくくうはくは、はんかくにおきかえて、あたらしめのぶらうざでならうごくよかもよ？

<!DOCTYPE html>
<html lang="ja">
　<meta charset="utf-8" />
　<title></title>

<body>
<h1>Test</h1>
<form onsubmit="return false">
　<ol>
　　<li>
　　　<dl>
　　　　<dt>
　　　　　漢字を使うべきだ
　　　　<dd>
　　　　　<input type="radio" name="q0" value="1">Yes,
　　　　　<input type="radio" name="q0" value="0">No
　　　</dl>

　　<li>
　　　<dl>
　　　　<dt>
　　　　　カタカナも使うべきだ
　　　　<dd>
　　　　　<input type="radio" name="q1" value="1">Yes,
　　　　　<input type="radio" name="q1" value="0">No
　　　</dl>
　　　
　　<li>
　　　<dl>
　　　　<dt>
　　　　　平仮名も使うべきだ
　　　　<dd>
　　　　　<input type="radio" name="q2" value="1">Yes,
　　　　　<input type="radio" name="q2" value="0">No
　　　</dl>
　　　
　　<li>
　　　<dl>
　　　　<dt>
　　　　　今度から、ローマ字表記で書くべきだ
　　　　<dd>
　　　　　<input type="radio" name="q3" value="1">Yes,
　　　　　<input type="radio" name="q3" value="0">No
　　　</dl>
　</ol>
　
　<p>
　　<input type="button" value="test" onclick="hoge(event)">
</form>
<script>
　function slice (es) { return Array.prototype.slice.call (es, 0); }
　function text (e) { return e.textContent; }
　function value (e) { return e.value; }
　function map (es, func) { return slice (es).map (func); }
　
　function hoge (event) {
　　var e = event.target;
　　var form = e.form;
　　var doc = form.ownerDocument;
　　var tmp;
　　var rst;
　　
　　tmp = form.querySelectorAll ('dt'); // 'ol > li > dl > dt'
　　alert ('質問数は ' + slice (tmp).length + ' 個あり、その内容は以下。\n' +
　　　map (tmp, text).join ('\n'));
　　
　　tmp = form.querySelectorAll ('dd > input[type="radio"]');
　　alert ('選択数は ' + slice (tmp).length + ' 個あり、その内容は以下。\n' +
　　　map (tmp, value).join ('\n'));

　　tmp = form.querySelectorAll ('dd > input[type="radio"]:checked');
　　alert ('選択されたのは ' + slice (tmp).length + ' 個あり、その内容は以下。\n' +
　　　map (tmp, value).join ('\n'));

　　tmp = form.querySelectorAll ('dd > input[type="radio"][value="0"]:checked');
　　alert ('0 が選択されたのは ' + slice (tmp).length + ' 個あり、その内容は以下。\n' +
　　　map (tmp, value).join ('\n'));

　　tmp = form.querySelectorAll ('ol > li:nth-of-type(2) > dl > dd > input[type="radio"]:checked');
　　alert ('２番目の回答は、' + slice (tmp).length + ' 個あり、その内容は以下。\n' +
　　　map (tmp, value).join ('\n'));
　}
</script>

- 0
- 件

通報する

この回答へのお礼

お礼が遅くなってしまってすみません。
わざわざありがとうございます！

こういうサンプルがあると、勉強させていただくのにとても
参考になります。

IE9で見てみましたが、なぜか文字化けしてしまいました(笑)
何か私がまちがえてしまったのでしょうか（＾＾；）

ありがとうございました。

通報する

お礼日時：2011/08/29 12:19

No.4

回答者： babu_baboo
回答日時：2011/08/29 14:00

ほぞんじｓたふぁいるのもじこーどが、utf-8 じゃないからだとおもふ。

- 0
- 件

通報する

この回答へのお礼

ありがとうございます。
IEのエンコードを確認したら、UTF―8になっていましたが、
日本語自動にすることによって改善しました！

私の作りたいページというのは質問が1問出て、それに○か×かで答えると
次の質問に進む。。。というようなページですので、教えていただいたものを参考に
勉強させてもらいます！

当たり前といえば当たり前なのですが、あんな文字の羅列でこんなページになるとは、
すごいですね！
改めて感激です。

何度もご回答していただいて、本当にありがとうございました。

通報する

お礼日時：2011/08/29 15:52

No.2

回答者： nicorus
回答日時：2011/08/26 11:47

リファレンス的な役目も兼ねていて結構使えるのは

http://www.tohoho-web.com/www.htm

ですかね。最新のブラウザには対応していない箇所がありますが
基礎固めにはもってこいです。

- 0
- 件

通報する

この回答へのお礼

回答ありがとうございます。
javascriptのページのJavaScript の基本文法のあたりからだんだん「？？？」って
感じになってきました・・・
分からない事が分からないくらいのレベルなものですみません。
このページを参考に、もう少し勉強してみます。
また、他にも分かりやすそうなページがあればよろしくお願いします。

通報する

お礼日時：2011/08/27 00:24

No.1

回答者： dscripty
回答日時：2011/08/26 10:50

とりあえず、マニュアル的な文書。

Core JavaScript 1.5 ガイド - MDN Docs
→ https://developer.mozilla.org/ja/JavaScript/Guide

でも、
HTML の基礎ができているなら、質問の中に JavaScript 以外の HTML のコードが書かれていてもよさそうだけど、そうじゃないみたいだから、もう少し HTML の基礎を固めたほうがいいかも？

『Academic HTML—HTML, XHTML and CSS Tutorials』
→ http://www.tg.rim.or.jp/~hexane/ach/
の『Academic HTML 4.0』のところ。

- 0
- 件

通報する

この回答へのお礼

回答ありがとうございます。
基礎出来てないんですかね？・・・って回答者様に聞いても、分からないですよね。
すみません(＾＾；)

HTMLのみ使うWebページなら分かります。
CSSもインターネットのページを検索しながら、使おうと思えば使える・・・
というくらいのレベルだと思います。

でもjavascriptが入ってくると混乱してきます。
なので、多分javascriptが分からないんだと自分では思っているのです。

Academic HTML 4.0を一通り拝見させていただきましたが、
全く理解が出来ない！というようなページはなさそうでした。

教えていただいた、Core JavaScript 1.5 ガイド - MDN Docsも参考に勉強させていただきます！
また分かりやすそうなページがあれば教えていただけると嬉しいです。
ありがとうございました。