Очень лекий DOM-helper
Очень много пишу под мобильные приложения. jQuery туда лучше не пихать (наше приложение само по себе безумно прожорливое и там можно много чего оптимизировать), так как каждый байт памяти и функция стека на счету :)
Нам не требутеся писать что-то под старые или странные браузеры, поэтому в том что я выложу нет поддержки ie < 9 и возможно чего-то ещё. То что я делаю ориентировано на нормальные современные браузеры и браузеры поднимаемые внутри мобильных платформ (webkid (если iOs, то прошивка 6.0+)) Сам хелпер должен быть очень легкий и не прожерливый, потому я сознательно не делал хранение созданных объектов! (Это могу пояснить подробнее) К сему хелперу (до либы ему далеко но мне того и не надо) есть нормальный интерфейс под ts. Есть ужатый вариант. Если тема кому-то понравится - добавлю нормальных доков (не понравится добавлю только себе :)) Сама либа: ссылка. Не пинайте сильно :) |
Примеры использования очень просты и напоминают jQuery. Я сознательно не стал реализовывать бешенные селекторы из jQ (мне это не требуется), но некоторое расширение апи планируется. Код до безобразия прост и расширение апи может производиться каждым по желанию :)
Промер:
$("#some").css({"width": "100500px"}).hide().show().append("<trololo>").append(document.querySelector(".some"));
Список методов: html([html]), addClass(className), hasClass(className), removeClass(className), toggleClass(className), append(string|HTMLElement|Lite),click(handler), hover(handlerEnter, handlerOut), on(event, handler), off([event], [handler]), css(string|object, [value]), attr(name, [value]), find(selector), children(), hide(), show(), remove(), offset(), parent(), width([value]), height([value]) Методы find и children возвращают коллекцию |
Цитата:
Цитата:
Цитата:
if (arguments.length) Цитата:
Цитата:
|
Чем zepto не устроил?
|
Octane,
Про конструктор забыл, спасибо! :) Про второй параметр знаю, но привычка уже бинд везде пользовать, Логи потом в более прилизанной версии, вместе с доками нормальными) Про класслист знаю, честно говоря не пользовался (раньше надо было ие держать, а сейчас по инерции), наверно заменю раз мне ие не надо. Спасибо за комментарии. |
nerv_,
Много лишнего. Этот же хелпер я частенько использую для халтуры (делаю html5 баннеры), а там ограничение по весу 35кб (с картинками, стилями и прочим). Я из хелпера то вырезаю иногда куски не то что готовые либы. |
Немного поизвращался со сжатием методов коллекции. Так как все что надо сделать - запустить метод для всех своих элементов я сделал некрасиво но ужато. Мне в Ts это ника не помешает, так как есть интерфейс, но что-то я засомневался в необходимсти такой экономии места. Зато ужатый весит 3кб (целиком, а не тольк этот кусочек) :)
/**
* @class Collection
* @extends Array
* @param {Array} arr
* @constructor
*/
var Collection = function (arr) {
arr.forEach(function (elem) {
this.push(elem);
}, this);
};
(function (Collection, extend, methods) {
Collection.prototype = extend;
Collection.prototype.constructor = Collection;
var collectionActionsList = ["remove", "click", "change", "hover", "on", "addClass", "removeClass", "toggleClass", "show", "hide"];
for (var methodName in methods) {
if (methods.hasOwnProperty(methodName)) {
Collection.prototype[methodName] = methods[methodName];
}
}
collectionActionsList.forEach(function (collectionMethodName) {
this.prototype[collectionMethodName] = function () {
return this._do(collectionMethodName, arguments);
}
}, Collection);
})(Collection, [], {
/**
* @return {Lite}
*/
last: function () {
return this[this.length - 1];
},
/**
* @return {Lite}
*/
first: function () {
return this[0];
},
/**
* @param {String} method
* @param {Array} [args]
* @return {Collection}
* @private
*/
_do: function (method, args) {
this.forEach(function ($elem) {
$elem[method].apply($elem, args);
});
return this;
},
/**
* @param mapHandler
* @return {Collection}
*/
map: function (mapHandler) {
return new Collection(Array.prototype.map.call(this, mapHandler));
},
/**
* @param filterHandler
* @return {Collection}
*/
filter: function (filterHandler) {
return new Collection(Array.prototype.filter.call(this, filterHandler));
}
});
|
Обратите внимание на мою Балалайку:
Кусок статьи с хабра Репка Недавно одобрили мой пулл риквест в microjs, теперь Балалайка есть в тамошнем списке: http://microjs.com/#balalaika |
Цитата:
|
| Часовой пояс GMT +3, время: 04:41. |