jQuery.facts

Расскажу несколько фактов о jQuery, которые как мне видится, не очень понимают “отечественные программеры”

• при “навешивании” обработчика какого-либо event-а к (например $(‘#element’).click(handler); ) он НЕ заменяет предыдущий обработчик (если таковой имелся), т.е. код:

  $('#element').click(function(){  alert('hello');})
  $('#element').click(function(){  alert('world'); })
  

  Выведет оба alert-а, а не только второй как думается некоторым.

• Непосредственно из первого вытекает следующий факт – конструкций $(document).ready(blablabla); в коде может быть “бесчисленное” количество раз – все обработчики вызовутся в порядке их добавления.
• Система событий в jQuery позволяет не ограничиваться теми событиями, которые есть в документации – можно создавать события самостоятельно:

  $('button').click(function(){ jQuery.event.trigger("buttonClicked");});
  $('div').bind('buttonClicked',function(){ $(this).hide();});
  $('span').bind('buttonClicked',function(){ $(this).show();});
  

  Подобная техника позволяет существенно упростить код и сделать его “читабельнее”.

• Анимационные эффекты в jQuery асинхронны и нередко возникает вопрос – как одну функцию выполнить строго после завершения первой. Все core-функции jQuery связанные с эффектами в качестве последнего параметра принимают callback – функцию, которая вызовется по завершению текущего эффекта:

  $('element-1').fadeOut(3000,function(){
        $('element-2').fadeIn(1500,function() {
        alert('done second effect');
     });
  });
  

• К ЛЮБОМУ html-элементу можно добавить ЛЮБОЙ атрибут (). По этим “самодельным” атрибутам элементы можно найти с помощью селекторов jQuery:

  var elements_by_attr = $('[@myownattr]');
  var elements_by_attr_with_value = $('[@myownattr="somevalue"]');
  var spans_by_attr = $('span[@myownattr]');
  

  Очень полезное “явление” при создании своих собственных элементов управления (и не только).

Ну и напоследок подкину найденную статейку “jQuery for JavaScript programmers”, прочитать которую стоит тем, кто только начинает осваивать прелести jQuery . Материал изложен на английском.