[JS]ユーティリティライブラリを作ってみる!

Posted in PHP

どうもisamです。

今日はjavascriptな気分って言う事で自分用のユーティリティライブラリを作ってみます。
いい悪いは取り敢えず別にして簡潔にかけるものというテーマで作っていきます。

ではコード!

var $ = {
	id : function(id) {
		return document.getElementById(id);
	},
	name : function(name) {
		return document.getElementsByName(name);
	},
	tag : function(tag) {
		return document.getElementsByTagName(tag);
	},
	event : function(obj, func, type) {
		if (obj.addEventListener) {
			//Netscape等
			obj.addEventListener(type, func, false);
		} else if (obj.attachEvent) {
			//IE
			obj.attachEvent('on'+type, func);
		}
	},
	create : function(tag, obj, text) {
		var t = document.createElement(tag);
		for(var o in obj) {
			t.setAttribute(o, obj[o]);
		}
		if(text != "") {
			t.appendChild(document.createTextNode(text));
		}
		return t;
	},
	add : function(obj, child) {
		obj.appendChild(child);
	}
}

使い方はこんな感じ

<form name="test_ie" action="./" method="get">
	<select name="pull">
		<option value="test1">テスト①</option>
		<option value="test2">テスト②</option>
		<option value="test3">テスト③</option>
		<option value="test4">テスト④</option>
		<option value="test5">テスト⑤</option>
		<option value="test6">テスト⑥</option>
	</select>
	<input type="button" value="選択" id="pull_b"/>
</form>
<div id="tt"></div>
<script type="text/javascript">
//プルダウンの4番目を選択する
function funcs() {
    document.test_ie.pull.selectedIndex = 3;
}

//span要素へ代入するテキスト
var val = "追加されたspan要素";
//span要素に追加する属性
var attr = {
	id : 'span_id',
	class : 'span_style'
};

//id="tt"の要素へspan要素を追加
$.add($.id("tt"), $.create('span', attr, val));
//イベントの追加
$.event($.id('pull_b'), funcs, 'click');
</script>

まだ中途半端だけど直ちょく機能追加していきます。

ではまた!

Posted by isam   @   1 5月 2010

Like this post? Share it!

RSS Digg Twitter StumbleUpon Delicious Technorati

1 Comments

Comments
Trackbacks to this post.
Leave a Comment

Name

Email

Website

Previous Post
«
Next Post
»
Powered by Wordpress   |   Lunated designed by ZenVerse