Сегодня на работе взялся за jQuery (достало строчить кросбраузерные скрипты километровые руками). Первое впечатление весьма положительное - всё элементарно и просто, в течении пары часов неплохо освоился, теперь остаёться практиковаться. Огромное кол-во плагинов тоже весьма положительно. А ваше мнение, опыт? Будет весьма полезно, т.к. я тока начал с ней работать.
Мм, jQuery это не AJAX либа, это JavaScript фреймворк - возможности у него большие - CSS селекторы комбинированные с XPath и JavaScript объектами - это просто что-то с чем-то. Советую приглянуться и почитать доки, что-то сделать с её помощью.
Как говорят великие гуру, принципы, заложенные в jQuery, противны самой сути JS. Хотя в большинстве относительно простых случаев она будет, несомненно, удобна.
dark-demon Умеет + есть плагины, которые расширяют её функционал с DOM. Вот сегодня закончил писать форму создание голосовалки, jQuery сделал эту задачу почти тривиальной. Код ниже. Используеться последняя версия jQuery + FlyDom плагин ( http://jquery.com/plugins/project/FlyDOM ) HTML: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <script type="text/javascript" src="/jquery.js"></script> <script type="text/javascript" src="/jquery.flydom.js"></script> <script type="text/javascript"> function start_poll(){ $("#poll_title").text("Заголовок опроса"); $('#poll').createAppend( 'table', {}, [ 'tr', {}, [ 'td', {}, ' ', 'td', { style: 'padding-left: 10px; vertical-align: middle;'}, '<input type="text" name="fpl_title" value="" maxlength="100" style="width: 300px;" \/> [ <a href="#" onclick="close_poll(); return false;">Отменить опрос<\/a> ]' ], 'tr', {}, [ 'td', { align: 'right'}, ' ', 'td', { style: 'padding: 10px 0 0 10px;'}, 'Варианты ответов' ], 'tr', {}, [ 'td', { align: 'right', style: 'padding: 10px 0 0 0;'}, '1', 'td', { style: 'padding: 10px 0 0 10px;'}, '<a href="#" onclick="add_question(this); return false;">Добавить вариант ответа<\/a>' ], ] ); } function close_poll(){ $("#poll tr:not(#tr_poll_title)").remove(); $("#poll_title").html('<a href="#" onclick="start_poll(); return false">Создать опрос</a>'); } function add_question(obj){ $("#poll").createAppend( 'table', {}, [ 'tr', {}, [ 'td', { align: 'right', style: 'padding: 10px 0 0 0;'}, ' ', 'td', { style: 'padding: 10px 0 0 10px;'}, '<a href="#" onclick="add_question(this); return false;">Добавить вариант ответа<\/a>' ], ] ); $(obj).parent("td").html('<input type="text" name="fpq_title[]" value="" maxlength="50" style="width: 300px;" \/> [ <a href="#" onclick="remove_question(this); return false;">Сбросить</a> ]'); update_counters(); } function remove_question(obj){ $($(obj).parents("tr")[0]).remove(); update_counters(); } function update_counters(){ $("#poll tr:gt(2)").each(function(i){ $(this).find("td:first").html(i+1); }); } </script> </head> <body> <div style="padding: 10px; margin: 10px 0px 10px 0px; border: 1px solid;" id="poll"> <table cellpadding="0" cellspacing="0"> <tr id="tr_poll_title"> <td>img<td> <td style="padding-left: 10px;" align="left" id="poll_title"><a href="#" onclick="start_poll(); return false">Создать опрос</a></td> </tr> </table> </div> </body> </html>
Меня больше волнует то, прикручивал ли кто например FCKEditor к jEditor-у? (последний является тоже своего рода плагином jQuery). jEditor это edit-in-place редактор, но загвоздка в том что там простое textarea, а я хочу туда вставить висивиг, желательно FCKEditor
> Умеет + есть плагины, которые расширяют её функционал с DOM. пример? > $($(obj).parents("tr")[0]).remove(); ужос... продолжу мысль: $($($(obj).parents("tr")[0]).childs("td")[3]).remove();
dark-demon А как ты думаешь получать доступ к ячейке, когда в строке их ~5-6? Всего то их два 1). Индексом, как у меня щас сделано 2). Через ID, что в моём случае какраз таки нереально, т.к. у меня создаёться N'ое кол-во строк, и удалять я могу не последную, а любую. В данном случае я получаю первую-же родительскую tr. Вообщем смотри внимательнее мой скрипт. Пример DOM плагинов для jQuery? http://jquery.com/plugins/project/Plugins/category/55 20 разных плагинов для DOM - выбирай на вкус и задачу. Batman Есть jQuery плагин для FCKEditor http://jquery.com/plugins/project/FCKEditor Я думаю если скомбинировать этот плагин с плагином jEditor, можно вполне добиться результата..
> А как ты думаешь получать доступ к ячейке, когда в строке их ~5-6? Всего то их два я не про это, а про доллары c кучей скобочек... у прототайпа.жс та же ботва... > Пример DOM плагинов для jQuery? я не это просил. например, мне нужно выбрать все текстовые узлы внутри определённого элемента. или, например, все комментарии. это возможно без написания своего tree-walker'а?
dark-demon Приведи пример HTML кода, я тебе скажу как это можно сделать средствами jQuery. Выбрать комментарии - каким образом? Какие комментарии. Код в студию.
<p> Мама <b> мыла </b> раму <!-- это комментарий --></p> нужно найти 8 по счёту символ внутри параграфа, чтобы потом перевести к нему курсор
dark-demon Я незнаю как это сделать даже обычным JS, потому что не делал. jQuery это потипу фреймворка - объект, который предоставляет определённый функционал. DOM в него не входит, используеться XPath и CSS селекторы. Если тебе нужно гибко манипулировать DOM'ом, то есть варианты: а) найди плагин, который это умеет б) Частично юзать jQuery и обычные DOM функции в) Сделать задачу без jQuery вообще. Можно получить ссылку на этот самый <p> таким образом [js] $("p"). здесь доступны все DOM функции. [/js]
если есть желание - можешь попробовать мой фреймворк: http://forum.vingrad.ru/forum/topic-175 ... 787/0.html а вот и тот самый волкер: [js]$node.prototype.$walkdesc= function( func ){ var cur= this.$1child(); while( cur ) { var pn= cur; var next; while( !( next= pn.$next() ) ) { pn= pn.$parent(); if( pn.$equal( this ) ) break; } cur= func.call( this, cur ); if( cur === false ) break; if( !cur ) cur= next; } }[/js]
http://jquery.com/blog/2008/06/09/jquer ... d-effects/ Заюзал в intranet проекте, делал жестокий drag&drop. Работает на ура и шустро. Интерфейс удобен и позволяет сделать кучи извращений. Да и сам jQuery дошел до 1.2.6. Очень доволен, ввел у себя его на работе. По мере использования постоянно улучшаю свои познания и улучшается код. Действительно некоторые совcем не тривиальные вещи, которые на plain js потребуют с несколько десятков строк (а то и 50+), можно уложить в 2-3 строки кода с использованием jQuery
К примеру такое [js]$('#auditory_table tr.auditory_row').find('td:eq(' + this.lectures[this.dragID].Time + ')') .filter('.free').removeClass('free').addClass('hover') .droppable({ accept: '.lection_div', drop: function(e, ui) { e = $(this); if (e.is('.hover')) { ui.helper.draggable("destroy").remove(); $('#auditory_table td.hover').removeClass('hover').addClass('free').droppable("destroy"); connector.onDrop(e, ui); e.removeClass('hover').removeClass('free').addClass('bisy'); } }, over: this._showTooltip });[/js] А делает оно следующее: 1). Находит в таблице с ID auditory_table все строки с классом auditory_row (там не все строки такие) 2). Ищет в этом все ячейки с номером индекса, заданным в this.lectures[this.dragID].Time 3). Отфильтровывает все ячейки, которые не содержат класс .free 4). У всех этих ячеек убирает класс free и добавляет класс hover 5). На все эти ячейки назначает droppable (это jQuery UI часть, которая позволяет скидывать на них элементы) с соответствующими настроками и callback функциями (а в самом droppable в callback для drop вы видите обработку скидывания и вызов connector который собственно обрабатывает само скидывание AJAX запросом). В этом методе ещё только 2 отдельных вызова, где один относится к другому элементу (меняются классы) и второй просто записывает в this.dragID нужные данные. Всего скрипт занял 290 строк с подгрузкой данных из 3-х источников, сохранением перетаскиваний в базу (+1 AJAX запрос), всеми инициализациями, динамической прорисовкой таблиц, отфильтрованных данных и красивым оформлением кода. А функционал таков, что позволяет на все лекции в университете назначить аудитории. Естественно там есть ещё и фильры для того, что бы видеть за раз только один день, для одного здания и для одной программы. Фильтры позволяют переключатся между: Филиалами Зданиями Учебными годами Семестрами Днями недели Программами
Psih возможно не в тему вопрос, но всё-таки.. Какие требования у скрипта к железу...эээ..юзера? Я правильно понимаю, что к такой системе на старом целерончеке даже не зачем лезть?
jquery хорош для примитивных пользователей. документация есть, плагины есть. есть не дочёти, но жить можно. бросил jquery, потому что выбесило писать плагины http://codes.termi.lv/examples/js/dropin/. на моё удивления дроп ин плагина не было. а так хорошая документация, легко всё пишется. мне больше по душе mootools.org. для анимации просто супер, для всяких манипуляций тоже. вот доки только галимые, понять сложно. легче даже сразу код почитать, а не доки.
Johnatan Небольшие, да и пишется это для Intranet системы управления, а не для WEB сайта, поэтому не проверял. Но на моём рабочем P4 2.4 GHz с 512 RAM работает быстро. А старый Celeron щас понятие слегка не определённое. Это какой? 800Mhz? nemec Ну jQuery UI только развивается. К тому же зачем обязательно делать как плагин? Я такое сделал быстро и без проблем. Это draggables + droppables, собственно именно такое у меня и происходит. Я тащю с одного места и закидываю в другое. Да и jQuery это не только Drag&Drop, это скорее вторично. А вот обрабатывать на нём данные это сущее удовольство. Можно практически забить на циклы mootools.org не существет, проект сдох?
попутал http://mootools.net/ етот та не сдохнит, в данний момент там апдейты, потому демо мало. можно посмотреть с предыдущей версии демо http://demos111.mootools.net/. можно здесь посмотреть плагини http://www.phatfusion.net/. последний прикольний googleDrive..;=]
jQuery хорош для всего... но нужно быть осторожным... на 6-ом эксплорере не отображаются некоторые вещи, например - у меня не загрузилась форма в слой... хотя, этот же скрипт прекрасно работает на 7-ке и опере... а так - все очень удобно и грамотно...
Мне кажется, что им нельзя увлекаться - в том смысле, что для пары функций не имеет смысла подгружать библиотеку. А новички могут как раз этим профаниться.
Kreker Ну я собственно и использую там, где нужно писать много и сложно. Вот последнее задание уложил в 300 строк кода, а до этого было посложнее D&D задание. так там вообще строк 500-600 было. Без jQuery было бы больше штуки DOM кода. А подгружать - он в minified версии маленький, да и кеширование нормально установить, тогда он будет у клиента на локалке вообще лежать и браться оттуда.