Light (4kb mini-jQuery)


/ Published in: JavaScript
Save to your folder(s)



Copy this code and paste it in your HTML
  1. (function () {
  2. /**
  3.  * Light
  4.  *
  5.  * This is an extreme small and easy JavaScript library. It can
  6.  * be used for small websites which won't be needing all the
  7.  * functionality of the bigger libraries around. Or use it to
  8.  * learn how to create your own library or framework.
  9.  *
  10.  * @author Victor Villaverde Laan <[email protected]>
  11.  * @link http://www.freelancephp.net/light-4kb-min-jquery-light/
  12.  * @license Dual licensed under the MIT and GPL licenses
  13.  */
  14.  
  15. /**
  16.  * Light function
  17.  */
  18. window.Light = function ( selector, parent ) {
  19. return new Light.core.init( selector, parent );
  20. };
  21.  
  22. // if global $ is not set
  23. if ( ! window.$ )
  24. window.$ = window.Light;
  25.  
  26. /**
  27.  * Light.core
  28.  * Contains the core functions
  29.  */
  30. Light.core = Light.prototype = {
  31.  
  32. // init function, set selected elements
  33. init: function ( selector, parent ) {
  34. var els;
  35.  
  36. selector = selector || window; // default is window
  37. parent = parent || document; // default is document
  38.  
  39. els = ( typeof selector == 'string' )
  40. ? Light.selector( selector, parent ) // use selector method
  41. : els = selector;
  42.  
  43. // reset elements
  44. this.els = [];
  45.  
  46. if ( typeof els.length != 'undefined' ) {
  47. // els is an array or object
  48. for (var i = 0, max = els.length; i < max; i++)
  49. this.els.push(els[i]);
  50. } else {
  51. // els is an element
  52. this.els.push( els );
  53. }
  54.  
  55. return this;
  56. },
  57.  
  58. // get the element of given index (return all elements when no index given)
  59. get: function ( index ) {
  60. return ( typeof index == 'undefined' )
  61. ? this.els
  62. : this.els[index];
  63. },
  64.  
  65. // get number of selected elements
  66. count: function () {
  67. return this.els.length;
  68. },
  69.  
  70. // set function to be run for each selected element
  71. each: function ( fn ) {
  72. for ( var x = 0, max = this.els.length; x < max; x++ )
  73. fn.call( this, this.els[x] );
  74.  
  75. return this;
  76. },
  77.  
  78. // set attribute value
  79. attr: function ( name, value, type ) {
  80. this.each(function( el ) {
  81. if ( typeof type == 'undefined' ) {
  82. el[name] = value;
  83. } else {
  84. el[type][name] = value;
  85. }
  86. });
  87.  
  88. return this;
  89. },
  90.  
  91. // set styles
  92. css: function ( styles ) {
  93. var that = this;
  94. this.each(function( el ) {
  95. for ( var name in styles )
  96. that.attr( name, styles[name], 'style' );
  97. });
  98.  
  99. return this;
  100. },
  101.  
  102. // add given className
  103. addClass: function ( className ) {
  104. this.each(function ( el ) {
  105. el.className += ' ' + className;
  106. });
  107.  
  108. return this;
  109. },
  110.  
  111. // remove given className
  112. removeClass: function ( className ) {
  113. this.each(function ( el ) {
  114. el.className = el.className.replace( className, '' );
  115. });
  116.  
  117. return this;
  118. },
  119.  
  120. // add event action
  121. on: function ( event, fn ) {
  122. var addEvent = function( el ) {
  123. if ( window.addEventListener ) {
  124. el.addEventListener( event, fn, false );
  125. } else if ( window.attachEvent ) {
  126. el.attachEvent( 'on'+ event, function() {
  127. fn.call( el, window.event );
  128. });
  129. }
  130. };
  131.  
  132. this.each(function( el ) {
  133. addEvent( el );
  134. });
  135.  
  136. return this;
  137. },
  138.  
  139. // add function to be executed when the DOM is ready
  140. ready: function ( fn ) {
  141. DOMReady.add( fn );
  142.  
  143. return this;
  144. },
  145.  
  146. // remove selected elements from the DOM
  147. remove: function () {
  148. this.each(function( el ) {
  149. el.parentNode.removeChild( el );
  150. });
  151.  
  152. return this;
  153. }
  154.  
  155. };
  156.  
  157. // Selector, default support:
  158. // $('#id') - get element by id
  159. // $('.className') - get element(s) by class-name
  160. // $('tagName') - get element(s) by tag-name
  161. Light.selector = function ( selector, context ) {
  162. var sels = selector.split( ',' ),
  163. el, op, s;
  164.  
  165. for ( var x = 0; x < sels.length; x++ ) {
  166. // trim spaces
  167. var sel = sels[x].replace(/ /g, '');
  168.  
  169. if ( typeof sel == 'string' ) {
  170. op = sel.substr( 0, 1 ); // operator
  171. s = sel.substr( 1 ); // name without operator
  172. if ( op == '#' ) {
  173. el = document.getElementById( s );
  174. el = ( isDescendant( el, context ) ) ? el : null;
  175. } else if ( op == '.' ) {
  176. el = getElementsByClassName(s, context);
  177. } else {
  178. el = context.getElementsByTagName(sel);
  179. }
  180. }
  181. }
  182.  
  183. return el;
  184. };
  185.  
  186. // init gets core prototype
  187. Light.core.init.prototype = Light.core;
  188.  
  189.  
  190. /**
  191.  * Helpers
  192.  */
  193.  
  194. // DOMReady, add functions to be executed when the DOM is ready
  195. var DOMReady = (function () {
  196. var fns = [],
  197. isReady = false,
  198. ready = function () {
  199. isReady = true;
  200.  
  201. // call all functions
  202. for ( var x = 0; x < fns.length; x++ )
  203. fns[x].call();
  204. };
  205.  
  206. // public add method
  207. this.add = function ( fn ) {
  208. // eval string in a function
  209. if ( fn.constructor == String ) {
  210. var strFunc = fn;
  211. fn = function () { eval( strFunc ); };
  212. }
  213.  
  214. // call imediately when DOM is already ready
  215. if ( isReady ) {
  216. fn.call();
  217. } else {
  218. // add to the list
  219. fns[fns.length] = fn;
  220. }
  221. };
  222.  
  223. // For all browsers except IE
  224. if ( window.addEventListener )
  225. document.addEventListener( 'DOMContentLoaded', function(){ ready(); }, false );
  226.  
  227. // For IE
  228. // Code taken from http://ajaxian.com/archives/iecontentloaded-yet-another-domcontentloaded
  229. (function(){
  230. // check IE's proprietary DOM members
  231. if ( ! document.uniqueID && document.expando ) return;
  232.  
  233. // you can create any tagName, even customTag like <document :ready />
  234. var tempNode = document.createElement('document:ready');
  235.  
  236. try {
  237. // see if it throws errors until after ondocumentready
  238. tempNode.doScroll('left');
  239.  
  240. // call ready
  241. ready();
  242. } catch ( err ) {
  243. setTimeout(arguments.callee, 0);
  244. }
  245. })();
  246.  
  247. return this;
  248. })();
  249.  
  250. // create a static reference
  251. Light.ready = DOMReady.add;
  252.  
  253. // Check wether an element is a descendant of the given ancestor
  254. function isDescendant( desc, anc ){
  255. return ( ( desc.parentNode == anc ) || ( desc.parentNode != document ) && isDescendant( desc.parentNode, anc ) );
  256. };
  257.  
  258. // Cross browser function for getting elements by className
  259. function getElementsByClassName( className, parent ) {
  260. var a = [],
  261. re = new RegExp('\\b' + className + '\\b'),
  262. els = parent.getElementsByTagName( '*' );
  263.  
  264. parent = parent || document.getElementsByTagName( 'body' )[0];
  265.  
  266. for ( var i = 0, j = els.length; i < j; i++ )
  267. if ( re.test( els[i].className ) )
  268. a.push( els[i] );
  269.  
  270. return a;
  271. };
  272.  
  273. })();

URL: http://www.freelancephp.net/light-4kb-mini-jquery/

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.