回答編集履歴

2 jsdo.itとかでもテストできそうな形にちょっと修正 utun score 410 2015/03/20 15:18 投稿

HTML、CSS、PHPがバッチリ出来るなら、基礎から学ぶ必要はあまりありません。

あと、PHPができるなら基礎的なプログラミング知識はあると思うので、入門書とかを見るのは時間の無駄かと思います。

以下の様なHTMLのみを元に、レスポンシブなWebページを自作してみては如何でしょうか。

DOMの追加、CSS定義等、全てJavascriptから行い、PHP側で用意したAPIから適当な内容を取得して表示するようなものを作れれば、ほぼJavascriptのキモは網羅できるかと思います。

```lang-HTML

<html>

<head>

</head>

<body>

</body>

</html>

```

```lang-Javascript

/* /js/test.js */

$(document).ready(function(){

$(body).append('<div>テスト</div>');

$('#continer').append('<div>テスト</div>');

});

```

※ jQueryだけは読み込むようにしていますが、DOM操作をJavascriptの元の操作で扱うのはかなり面倒なので、何かしらそれ系のライブラリは最初から利用されることをお勧めします。

例えばこんな感じです。

１、ページ表示時に基本ページ用のデータをajaxにて取得、及び表示

２、css transitionやjQueryのanimate等を使い、動きのあるボタンやプルダウン等を作る

３、何かのボタンを押したタイミングで、ajaxにてにデータを投げ、結果を受け取り、それをWebページ上に反映させる

但し、PHPと大きく違う以下の2点は事前に調べておくことをお勧めします。

１、クラスの作り方

２、コールバックの使い方

（特に無名関数をコールバックとして記述することが非常に多いので、その辺りです）

以上、ご参考になれば幸いです。

1 test.jsのパスを相対パスに変更（ローカルでテストしにくい気がしたので） utun score 410 2015/03/20 15:15 投稿