JQuery oh JQuery…

Bismillah…

Hello World! ๐Ÿ˜€

Beberapa waktu yang lalu, saya sempet belajar tentang JQuery, nah sekarang saya ingin berbagi kepada kalian. Apa sih JQuery itu? ๐Ÿ˜›

Setahu saya, JQuery merupakan salah satu library JS(JavaScirpt). Kalo di PHP kita mengenal framework, maka JQuery bisa juga dianggap salah satu “framework” nya JS. Soalnya kebanyakan emang diposisikan seperti sebuah ‘function’ atau class untuk ditempelkan pada sebuah web/aplikasi berbasis HTML atau PHP.

Banyak manfaat kita mempelajari JQuery ini, karena JQuery punya keunggulan pluginable, artinya JQuery bisa ditambahi berbagai plugin. untuk belajar JQuery, paling ga harus kenal DOM(Document Object Model), javascript dan konsep OOP(Orientation Object Programming).

Beberapa Fungs JQuery

1. Mengakses bagian halaman tertentu dengan mudah
2. Mengubah tampilan bagian halaman tertentu
3. Mengubah isi dari halaman
4. Menambah animasi tanpa harus flash
5. Load data tanpa merefresh seluruh halaman
6. Menyederhanakan penulisan JS biasa

Dan penggunaan JQuery ini, bisa dilihat, dan rasakan di beberapa website terkenal seperti : Gmail, Facebook, wibiya.com, dan beberapa E-commerce 2.0 dan sepertinya yahoo mail juga…

Sesuai dengan slogannya write less, do more! JQuery emang lebih membutuhkan lebih sedikit code daripada JS.

seperti contoh di bawah:
ini adalah contoh penulisa dalam JS

/* is this stuff defined? */
if (!document.ELEMENT_NODE) {
	document.ELEMENT_NODE = 1;
	document.ATTRIBUTE_NODE = 2;
	document.TEXT_NODE = 3;
	document.CDATA_SECTION_NODE = 4;
	document.ENTITY_REFERENCE_NODE = 5;
	document.ENTITY_NODE = 6;
	document.PROCESSING_INSTRUCTION_NODE = 7;
	document.COMMENT_NODE = 8;
	document.DOCUMENT_NODE = 9;
	document.DOCUMENT_TYPE_NODE = 10;
	document.DOCUMENT_FRAGMENT_NODE = 11;
	document.NOTATION_NODE = 12;
}

document._importNode = function(node, allChildren) {
	/* find the node type to import */
	switch (node.nodeType) {
		case document.ELEMENT_NODE:
			/* create a new element */
			var newNode = document.createElement(node.nodeName);
			/* does the node have any attributes to add? */
			if (node.attributes && node.attributes.length > 0)?
				/* add all of the attributes */
				for (var i = 0, il = node.attributes.length; i < il;)?
					newNode.setAttribute(node.attributes[i].nodeName, node.getAttribute(node.attributes[i++].nodeName));
			/* are we going after children too, and does the node have any? */
			if (allChildren && node.childNodes && node.childNodes.length > 0)?
				/* recursively get all of the child nodes */
				for (var i = 0, il = node.childNodes.length; i < il;)?
					newNode.appendChild(document._importNode(node.childNodes[i++], allChildren));
			return newNode;
			break;
		case document.TEXT_NODE:
		case document.CDATA_SECTION_NODE:
		case document.COMMENT_NODE:
			return document.createTextNode(node.nodeValue);
			break;
	}
};

sedang untuk JQuery, hanya dibutuh kan satu baris code ini aja :

$(โ€œ#contentโ€).load(โ€œpage.htmlโ€);

lebay yak? ๐Ÿ˜€ yah kenyataannya emang gitu, gimana lagi? ๐Ÿ˜›

Untuk semenara, itu aja dulu. Untuk belajar lebih lanjut, jangan lupa download librarynya disini :

http://docs.jquery.com/Downloading_jQuery

๐Ÿ˜‰

~r5

Advertisements

No comments yet

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: