Быстрый поиск DOM-элементов

Octane, 28.02.2009

js-core dom traversingВ новых браузерах для перемещения по DOM-дереву появилась возможность использовать интерфейс «Element Traversal», который позволяет искать элементы, исключая текстовые узлы так, как это происходит в Internet Explorer, при использовании стандартных firstChild, lastChild, nextSibling и previousSibling, что увеличивает скорость поиска элементов.

Читать полностью

Категории: JavaScript, js-core, Работа с DOM | Комментарии (5)

CSS-селекторы в js-core

Octane, 12.01.2009

Логотип js-coreВстроенной поддержки механизма выборки элементов с использованием CSS-селекторов нет, но легко внедрить один из существующих.

Возьмем готовые решения Sizzle, Peppy и Yass, и сделаем расширение для js-core, которое будет автоматически преобразовывать список элементов, выдаваемый этими движками, в объект для работы со списками узлов, предусмотренный в framework’е.

Читать полностью

Категории: CSS, JavaScript, js-core | Комментарии (4)

js-core reloaded

Octane, 08.01.2009

js-core logotypeИтак, прошло уже много времени с момента, когда я (Коробкин Дмитрий) начал заниматься разработкой своего JavaScript фреймворка. Целью было создать продукт, который бы занял свое место среди небольших и быстрых библиотек, позволяющих более удобно производить манипуляции с DOM, легко организовывать AJAX-запросы, а главное в какой-то степени избавить программиста от проблемы кросс-браузерности.

Теперь, пройдя множество исправлений, дополнений и модификаций, js-core вполне может использоваться в проектах любой сложности, обеспечивая достойный уровень производительности. В версии 2.7 структура фреймворка была полностью изменена, он не будет вызывать конфликты с другими скриптами, из-за внедрения пользовательских методов в прототипы встроенных объектов JavaScript. В глобальное пространство имен помещается только один объект с ссылками core и $ на него. Появилась возможность работы со списками узлов.

Читать полностью

Категории: JavaScript, js-core | Комментарии (11)

Интеграция «Peppy» и «js-core»

Octane, 03.11.2008

Не так давно Джеймс Донахью выпустил первый бета-релиз «Peppy» — движка селекторов, предоставляющего возможность использовать CSS3 для выборки элементов. По результатам сравнительных тестов на производительность «Peppy» занимает топовые позиции.

Так как я пока сомневаюсь, стоит ли мне писать подобный модуль для «js-core», потому что считаю, что вполне достаточно стандартных методов DOM для выбора нужных узлов, но всё-таки иногда бывают случаи, когда использование синтаксиса CSS-селекторов для этих целей очень удобно, я решил попробовать совместить мой фреймворк и библиотеку «Peppy». Как оказалось, все очень просто.

Читать полностью

Категории: JavaScript, js-core | Комментариев нет

«js-core» — JavaScript framework

Octane, 29.09.2008

Не так давно я начал заниматься разработкой JavaScript framework’а «js-core» для применения в небольших проектах, в которых использование таких готовых универсальных решений, как «Prototype», «MooTools» или «jQuery» является не оправданным, в связи с достаточно большим объемом кода, большая часть которого не используется. Framework получился легкий (в несжатом виде версия 2.5.1 занимает около 15кб), но в тоже время достаточно функциональным.

Читать полностью

Категории: js-core | Комментарии (1)

«js-core» test drive

Octane, 15.09.2008

«js-core» test driveРешил провести небольшой тест производительности своего JavaScript framework’а «js-core». Для сравнения, конечно же, взял «jQuery», который хорошо знаю и имею отчетливое представление о его работе.

Конечно, «js-core» не столь функционален, как «jQuery», поэтому я решил провести тест, на примере, который можно записать практически одинаково и в моем framework’е и в «jQuery».

Читать полностью

Категории: js-core | Комментарии (16)

«js-core» — новый JavaScript framework

VitaliyRodnenko, 05.09.2008

js-coreРазработка Коробкина Дмитрия (Octane) — специалиста по веб-интерфейсам в нашей веб-студии в Волгограде. Небольшой, но многофункциональный framework для удобного и быстрого программирования на JavaScript.

Читать полностью

Категории: JavaScript, js-core | Комментарии (2)

«prepend» — добавление нового узла в начало списка дочерних узлов

Octane, 25.07.2008

Функция prepend добавляет новый или перемещает существующий узел в начало списка дочерних элементов текущего узла и возвращает копию объекта _$, содержащую ссылку на новый/перемещенный узел.

Входные параметры

В качестве входного параметра функция может принимать строку с именем тега нового узла или ссылку на уже существующий узел.

  • prepend('div') — функция создаст новый узел с именем тега DIV и поместит его в начало списка дочерних элементов текущего узла.
  • prepend(node) — функция переместит узел, доступный по ссылке node, в начало списка дочерних элементов текущего узла.

Пример использования

$('test').prepend('div');

В начале списка дочерних элементов узла с идентификатором test будет добавлен новый узел с именем тега DIV.

Аналог без использования фреймворка

function prepend(id, tag) {
  var node = document.getElementById(id),
  first = node.firstChild,
  newNode = document.createElement(tag);
  node.insertBefore(newNode, first);
  return newNode;
}

prepend('test', 'div');

Категории: js-core, Работа с DOM | Комментарии (2)

«append» — добавление нового узла в конец списка дочерних узлов

Octane, 24.07.2008

Функция append добавляет новый или перемещает существующий узел в конец списка дочерних элементов текущего узла и возвращает копию объекта _$, содержащую ссылку на новый/перемещенный узел.

Входные параметры

В качестве входного параметра функция может принимать строку с именем тега нового узла или ссылку на уже существующий узел.

  • append('div') — функция создаст новый узел с именем тега DIV и поместит его в конец списка дочерних элементов текущего узла.
  • append(node) — функция переместит узел, доступный по ссылке node, в конец списка дочерних элементов текущего узла.

Пример использования

$('test').append('div');

В конец списка дочерних элементов узла с идентификатором test будет добавлен новый узел с именем тега DIV.

Аналог без использования фреймворка

function append(id, tag) {
  var node = document.getElementById(id),
  newNode = document.createElement(tag);
  node.appendChild(newNode);
  return newNode;
}

append('test', 'div');

Категории: js-core, Работа с DOM | Комментариев нет

«parent» — получение родительского узла

Octane, 24.07.2008

Функция parent возвращает копию объекта _$, содержащую родительский узел текущего узла.

Пример использования

var node = $('test').parent();

В переменную node будет помещен объект с ссылкой на родительский узел текущего узла с идентификатором test. Чтобы получить сам узел, необходимо обратиться к атрибуту node возвращаемого объекта или воспользоваться функцией el.

var node = $('test').parent().node;
//или
var node = $('test').parent().el();

Аналог без использования фреймворка

function parent(id) {
  return document.getElementById(id).parentNode;
}

var node = parent('test');

Категории: js-core, Работа с DOM | Комментариев нет

480×60
480×60