19 сентября 2009-го
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30
19 сентября 2009, 11:15
Javascript: minijQuery 0.0.0.1 alpha :D
Есть много проектов, где функционал Джиквери слишком излишен, и используется от сили 1% возможностей? Зачем тогда тянуть 55кб? Если тот проект вместе с графикой в два раза меньше ;)
Недолго подумав, решил начать писать нечто кастомное. Название всплыло само собой minijQuery. Сразу скажу, для работы использует $ и addLoadEvent, что бы сразу было кроссбраузерно и красиво ;)
Ограничения (поддерживает только двухуровневый запрос):
Недолго подумав, решил начать писать нечто кастомное. Название всплыло само собой minijQuery. Сразу скажу, для работы использует $ и addLoadEvent, что бы сразу было кроссбраузерно и красиво ;)
minijQuery = function(pattern, action) { // пустой патерн, уходим, возможно скоро закоментируется if (typeof pattern != "string" || pattern.length < 1) return; // объявляем дефолтный выбор var _target = document.body; // контейнер всё боди var _select = "*"; // выбераем все теги var _class = false; // класс // разбиваем на части запросик var selector = pattern.split(" "); var parts = selector.length; // дальше по сценарию switch (parts){ case 1: //если всего один, подразумеваем тег.класс var sel = selector[0].split("."); _select = sel[0]; _class = sel[1]; break; default: // если больше, значит есть ещё и #контейнер var sel = selector[0].split("#"); _target = $(sel[1]); var sel = selector[1].split("."); _select = sel[0]; _class = sel[1]; } // дальше просто перебераем в контейнере, все нужные тэги var tag_s = _target.getElementsByTagName(_select); for(var i=0; i < tag_s.length; i++) { if (tag_s[i].className == _class || !_class) { // совпал класс, или не задан выполняем действие // пока только элементарные // скоро они преврятятся в методы switch (action) { case "hide": tag_s[i].style.display = 'none'; break; case "show": tag_s[i].style.display = 'inline'; break; case "toggle": var _display = tag_s[i].style.display; tag_s[i].style.display = _display != 'none' || _display.length < 1 ? 'none' : 'inline'; break; } } } // возвращаем список выбраных элементов return tag_s; }Попробовать пример можно слева, на тэгах, посмотреть отдельно, будет ссылка ниже.
Ограничения (поддерживает только двухуровневый запрос):
- .класс
- тэг.класс
- #конетйнер .класс
- #конетйнер тэг.класс
- #конетйнер тэг
- всё остальное идёт боком ;)
- добавить простейшую рекурсию, для более вложенных запросов;
- расширить функционал изменением стилей;
- добавить методы / выкинуть второй параметр;
3 комментария| 17 сентября 2009-го . . . | ← | Ctrl | → | . . . 24 сентября 2009-го |
