2、3か月前に友人からjavascriptが熱いことを聞いた。
そして、もはやjavascriptを利用したweb開発のデファクトスタンダードになったjquery。
Ubuntuのwebサーバーで試してみます。
1. 例題ソースの取得
2. jquery取得配置
1. 例題ソースの取得
gihyoさんで紹介されたjquery入門ページのソースを取得します。
ちなみにここに載っているソースはjsdo.it（リンク）というクラウド上の開発プラットフォームです。
お互いのソースを自由に見たり、自由に改変したりすることができます。
2. jquery取得配置
jsdo.itはクラウド上のプラットフォームなので、ディレクトリ配置とかファイルの読み込みは自動でやってくれます。
しかし、自分のサーバーでやる場合は、ディレクトリ配置、読み込み設定などをやらないといけません。その手順を書きます。
まず取得したソースをFTPでサーバーに転送しましょう。
ディレクトリ構造は、
test
-- sample.html
-- js
-- sample.js
-- css
-- sample.css
みたいな感じでOK。
次にhtmlとcssに読みとり権限、jsに読みとり、実行権限を付加します。
chmod 644 sample.html
chmod 644 css/sample.css
chmod 755 js/sample.js
あと、testディレクトリに実行権限がないと表示されないようです。
モジュールを格納するtestディレクトリにも
chmod 755 test
としておきます。
最後に、sample.htmlファイルをいじります。
jsdo.itにはbodyの中身しか書いていませんので、javascriptやcssの設定をヘッダに追記します。
具体的には、以下のようにします。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/sample.js"></script>
<link rel="stylesheet" type="text/css" href="css/sample.css">
</head>
<body>
ここにjsdo.itのHTMLソースが入る
</body>
</html>
おっと、肝心のjqueryを忘れてた。公式サイトから取得します。
testディレクトリで以下を実行。
wget http://code.jquery.com/jquery-1.6.1.js
mv jquery-X.X.X.js js/jquery.js
chmod 755 js/jquery.js
（※X.X.Xはバージョン番号。）
あれ、、、動かない。。そうか。
sample.jsもjsdo.itにあるものから少し変更が必要です。
jsdo.itの場合は、自動で関数をロードしますが、自分のサーバーでやるときは関数のロードを
明記します。
$(document).ready(function(){
※ここにjsdo.itのjsソースが入る
});お、出来た。
[まとめ]
- jqueryは簡単。使いやすい。
- jqueryの本体は1つのjsファイルから出来ていることにびっくり。
- うまくいかないときはApacheのlogを見る
サーバー奮闘記一覧はこちらから。ここに書いていることを順にやれば、いろいろできるようになるかも！？
0 件のコメント:
コメントを投稿