ilusha_sergeevich Jul 10 2013 at 04:07

Voyeur.js — маленькая и привлекательная библиотека для работы с DOM

1 min

14K

Website development*JavaScript*

Comments 22

kirugan Jul 10 2013 at 04:35

А в чем преимущество? Fluid interface по именам тегов?

ilusha_sergeevich Jul 10 2013 at 04:38

Преимущество перед чем?

kirugan Jul 10 2013 at 04:43

Тем же jquery

hell0w0rd Jul 10 2013 at 04:49

вес? и я бы сравнивал на с jquery, а c sizzle

ilusha_sergeevich Jul 10 2013 at 04:59

Начнем с того, что Voyeur.js в ~ 100 раз меньше jQuery. Он не «издевается» над нативным JS синтаксисом. Для меня эта библиотека удобнее, по сравнению с тем же Sizzle (если говорить об объеме). Недавно появилась интересная статья «9 Signs You Shouldn’t Hire THAT Web Guy – 2013 Edition от David Walsh» там даже есть два абзаца «They're a „lump.js“ Developer» и «They Include Unnecessary Libraries».

UFO just landed and posted this here

Zibx Jul 10 2013 at 12:07

Это чем jQuery издевается? Обычный js код. Прототипы вроде не расширяет даже.

StreetStrider Aug 17 2013 at 12:31

Скорее Voyeur издевается. Налицо пляски с defineProperty.

Snowly Jul 10 2013 at 08:56

Из документации:

Which browsers does Voyeur support?
Voyeur is tested in and supports all the latest, major browsers (IE10, Chrome, Firefox, Safari, Opera).

как-то не густо…

VanSanblch Jul 10 2013 at 08:56

Если уж размер имеет значение то почему не Zepto? Production версия «9.7k when gzipped». Плюс последние версии jQuery разрешают создание собсвенной сборки с только требуемым функционалом.

Конечно прескорбно видеть как jQuery суют куда попало и используют только для получения элемента по id.

Но, имхо, это такая же крайность как превращать свой код в зоопарк и кидаться и стороны в сторону «лишь бы не jQuery».

printf Jul 10 2013 at 09:48

Довольно-таки безобразно.

Voyeur.div.h1; // body>div>h1. Возвращает элемент h1
Voyeur.div.ul.li; // Возвращает массив элементов списка

Изменил разметку — и вместо элемента в коде массив, отлично-отлично. А если в списке не оказалось пунктов, то вообще ничего не вернется, по всей видимости. Зачем так жить.

Voyeur.create.div; // Создание элементов

Нестандартные элементы (<create></create>) пролетают. Вообще сайд-эффекты в геттере это странно, такой код сложно поддерживать.

Моя нелюбовь к jQuery только что пошатнулась, теперь я знаю, что есть способ хуже.

+10

PoN Jul 10 2013 at 14:56

Еще — Voyeur.div.ul.li.use(); // Возвращает элемент div

dom1n1k Jul 10 2013 at 09:49

Код-то интуитивно понятен, но кмк в реальной практике будет неудобен.
— Как получить элементы нескольких типов?
— Что если название тэга в переменной?
— Voyeur.find значительно длиннее и глазомозольнее, чем $
ну и т.д.

leshaogonkov Jul 10 2013 at 10:28

Не смог пройти мимо третьего пункта, простите.

;(function(V) {
    V.find(...)
}(Voyeur));

andruekonst Jul 10 2013 at 13:15

Если название тэга в переменной, проблем возникнуть не должно: Voyeur.div[tagVariable]

dshster Jul 10 2013 at 10:35

> supports all the latest, major browser
Так при таком подходе можно и querySelector приспособить — вообще обойтись без сторонней библиотеки

Keyten Oct 30 2013 at 13:53

Как это без сторонней? А как же Vanilla JS?

xiWera Jul 10 2013 at 10:38

Угу, красиво, только вот чтобы использовать сгенерированный же в коде селектор нужно будет делать eval… либо извращаться с генерацией селектора, что не всегда хорошо ложится на такое

chuck Jul 10 2013 at 10:55

А что за название такое странное, переводится как «человек с половым извращением».
oxforddictionaries.com/definition/english/voyeur

hannimed Jul 10 2013 at 11:11

Поясните пожалуйста:

Voyeur.create.div; // Возвращает элемент div
Voyeur.create.div.h1; // Возвращает элемент h1 с родителем div
Voyeur.create.div.h1.em; //

Это же свойства, каким образом они вызывают функции? Геттеры/сеттеры?

NekR Jul 10 2013 at 12:29

Да. И весь этот ужас такой медленный…

Voyeur.extendTags = function(obj, fn) {
Voyeur.nodes.forEach(function(tag) {
Object.defineProperty(obj, tag, {
get: function() {
return fn.call(obj, tag);
},

configurable: true
});
});

return obj;
};

П.С. Извините, тэги не работают.

hannimed Jul 10 2013 at 12:30

Ясно. Спасибо. Отсюда и такой низкий охват совместимости…

Show the best of all time