jsで手軽にモジュール化する方法のメモです。
名前空間を作ったり、
ちゃんとしたモジュールパターンの記事などはこちら
http://qiita.com/Im0_3/items/3d46f900aa4d4c5c3cde
http://qiita.com/KENJU/items/a8a1009f5872a8b12568
kissメソッド、
hugメソッドなどを持っている、
Loveというモジュールの例です。微妙ですが。
即時関数でくくって作ります。
module.js
var Love = (function(w, d){
return{
kiss:function(){
console.log("キッスします");
},
hug:function(){
console.log("ハグします");
},
// pタグの中身を「愛」に変更するメソッド
changeTextLove:function(){
var list = d.querySelectorAll('p');
for(var i = 0; i<list.length; i++){
list[i].innerHTML = "愛";
}
}
};
})(window, window.document);
使い方は普通にモジュール化したjsを読み込んで、
Love.kiss();
Love.hug();
のように使います。
index.html
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>モジュールの作り方コードメモ</title>
</head>
<body>
<p>恋</p>
<p>初恋</p>
<p>淡い恋</p>
<!-- モジュール読み込み -->
<script src="module.js"></script>
<script type="text/javascript">
document.addEventListener('DOMContentLoaded', function() {
Love.kiss(); // キッスします
Love.hug(); // ハグします
Love.changeTextLove();
});
</script>
</body>
</html>
以上。