Развесь шарики на ёлочке и узнай, счастливым ли будет год!

Код для установки скрипта у себя на сайте (в блоге):

<link rel="stylesheet" type="text/css" href="http://nickolay.info/jscript/newyeartree/css/styles.css"/>
<script type="text/javascript" src="http://nickolay.info/jscript/newyeartree/js/prototype.js"></script>
<script type="text/javascript" src="http://nickolay.info/jscript/newyeartree/js/newyear.js"></script>
<div id="content" class="newyear" onclick="addBall(event)"></div>
<p id="result">Развесь шарики на ёлочке и узнай, счастливым ли будет год!
<script type="text/javascript">
 for (var k=1; k<=len; k++) {
  document.writeln ('<img src="http://nickolay.info/jscript/newyeartree/img/'+k+'.gif" style="display:none;">');
 }</script></p>

 Скачать исходники в архиве ZIP (79 Кб)

Скрипт может служить примером использования Javascript-фреймворка Prototype вместо неизменного JQuery. Несмотря на то, что JQuery считается как раз наследником Prototype, я не уверен, что он всегда удобней :) Приятно, например, что весь основной функционал фреймворка умещается в 5 функциях. В отличие от JQuery, в котором нет классов, в Prototype классы и интерфейсы есть. JQuery считается проще для понимания, но это всё крайне субъективно. Взглянем на одинаковые коды в 2 фреймворках.

Добавление кода HTML после элемента с указанным id (равным значению myid):

Prototype:
new Insertion.After('myId', 'HTML');
jQuery:
$('#myId').after('HTML');

Куда лучше нормальные new и список параметров, чем $('#myId'). Да и # всё время ставить...

А вот здесь мы в контейнере place занимаемся вызовом серверного скрипта из клиентского, указав метод передачи данных get и список параметров par:

Prototype:
new Ajax.Updater('place', url, { method: 'get', parameters: par });
jQuery:
$('#place').load(url + par);

Ну и как догадаться, что этот load вообще имеет отношение к Аяксу?

Конечно, я здесь немного утрирую... а цель заметки - просто напомнить о том, что JQuery - не единственный в мире фреймворк, а у краткости не всегда есть брат :)

гостевая; E-mail